Dasar Tag HTML Form Awal formulir ditandai dengan Tag <FORM>, dan berisi dua kata kunci: METHOD dan ACTION. <form name=nama_form method=post/get action=nama_file/email>

Slides:



Advertisements
Presentasi serupa
Amy Cintya Fitri Pendidikan B. Jepang 2 A
Advertisements

HTML.
Mengelola isi halaman web
HTML Hyper Text Markup Language
Hyper Text Markup Language
Modul Design & Pemrograman Web
Membuat form HTML+PHP Dwi Cahyono.
Matakuliah Pengenalan Internet STMIK Palangkaraya Oleh : Suparno Blog : Pengenalan HTML - 2 Bullet Numbering.
Pengembangan Web Pertemuan 2 HTML Basic (Text Formating, Link & Frame)
HTML PEMROGRAMAN INTERNET. Form & Input HTML Form adalah area yang bisa ditempati oleh elemen form. Elemen form adalah elemen yg mengijinkan user memasukkan.
Dosen: Zakki Falani, S.Kom Fakultas Ilmu Komputer Universitas Narotama
Nine: Pengantar HTML The Net Language. 2 Objectives Setelah menyelesaikan bab ini, anda diharapkan dapat: Memahami konstruksi dasar halaman web. Mengerti.
Timoti Adri Mahendra Putra, S.Kom SMK WIRA HARAPAN
STMIK PPKIA Pradnya Paramita
DASAR HTML Marina Azizah. Struktur Dokumen HTML Dokumen HTML bisa di bagi mejadi tiga bagian utama: HTML Setiap dokumen HTML harus di awali dan di tutup.
Praktek Dasar HTML Ulla Delfana Rosiani, ST. Praktek Dasar HTML Anda akan mempelajari tentang: Membuat sebuah home page Memformat text Membuat links ke.
Dasar Tag HTML  Catatan: Jika Anda ingin menambahkan komentar pada dokumen HTML,maka tulislah Tag,misal: NEXT.
Pemrograman Internet 1 STMIK PPKIA Pradnya Paramita.
Print Preview Dokumen word berbentuk digital, biasanya akan dicetak kedalam bentuk kertas Untuk melihat bentuk dokumen tercetak digunakan perintah File>
Page properties Cara 1: Cara 2: Menu Modify - Ctrl + J Page Properties
Start TagNNIEW3CKegunaan Mendefinisikan sebuah dokumen html Mendefinisikan isi/badan suatu dokumen Mendefinisikan heading ke 1.
Materi 11 Membuat Form Hai. Saya akan menunjukkan bagaimana membuat web page yang bersifat interaktif dengan penggunaan tag. Dengan tag ini anda dapat.
Apa itu HTML ? Perangkat lunak yang digunakan untuk membuat atau mengetikkan kode file HTML Perangkat lunak yang digunakan untuk menjalankan atau menampilkan.
HTML.
HTML (Hypertext Markup Language)
Modul Design & Pemrograman Web
Pengembangan Evangs Mailoa Enumerasi, Image & Table WEB.
FORM PADA WEB WEB 1 KELAS X.
Web Programming HTML. Outline Element HTML Basic Tag HTML Format HTML Entiti HTML Links HTML Frame HTML Table HTML List HTML Form HTML Image HTML Background.
PEMROGRAMAN BERBASIS WEB
KELOMPOK 10 PROYEK 5 Formulir Pembelian Buku Web / HTML
Anggota Kelompok  Dwini Andriani  Hendra Muda Nasution  Riza Yanuar
Form dan Input HTML.
CSS (Cascading Style Sheet)
Pengantar Pemrograman WEB
Bekerja dengan file dan desain web
Ega puspitriani Pendidikan B. Jepang 2 A
HTML (Hypertext Markup Language)
BASIC TAG Belajar HTML COBA COBA 1 HASILNYA STRUKTUR HTML HTML Setiap document HTML harus di awali dan di tutup dengan tag HTML HEAD Bagian header dari.
Atribut dalam Body Atribut dan contoh penulisan Fungsi
FORM Kegunaan Form : memperoleh data-data user baik nama, alamat dan data lainnya untuk mendaftar pada service yang di sediakan. memperoleh informasi pembelian.
Perancangan Web Pertemuan IV
Fakultas Teknologi Informasi Universitas Budi Luhur
Pertemuan 2 : HTML.
Pertemuan 2 1.  Bahasa yang digunakan untuk menampilkan informasi pd halaman web.  bahasa ini menggunakan tanda (markup) untuk menandai perintah- perintahnya.
Pertemuan ke 2 Ahmadi Sistem Informasi STMIK “BINA NUSANTARA JAYA”
HTML Universitas Muhammadiyah Surakarta Yogiek Indra K.
Mengelola isi halaman web
Mengenal dan teknik pembuatan form
Pemrograman Web List, link, & Tag img
STMIK PPKIA Pradnya Paramita Pemrograman berbasis Web
PERTEMUAN 2 HTML (Lanjutan).
Komputer aplikasi it-I (html)
PENGANTAR HTML NEXT.
Dasar Skrip / Tag HTML Pertanyaan mendasar dari web designer pemula:
PENGATURAN TAMPILAN WEBSITE I
PJ : Nuraini Purwandari
Komputer aplikasi it-I (html)
List, Image, Link dan tabel
Hyperlink & Form Pertemuan 11
Hyperlink and Form Session 10 & 11
Mengelola isi halaman web
Pemrograman Web HTML (5) Form CSS Andy Haryoko, ST
KOMPUTER APLIKASI IT I FORM.
MEMBUAT LIST.
Kurikulum dan Teknologi Pendidikan Universitas Negeri Semarang
Darmawan satyananda Mathematics department State university of malang
List dan Image pada HTML
CSS (Cascading Style Sheet)
Desain Web dengan Tag HTML
Transcript presentasi:

Dasar Tag HTML Form Awal formulir ditandai dengan Tag <FORM>, dan berisi dua kata kunci: METHOD dan ACTION. <form name=nama_form method=post/get action=nama_file/email> BACK NEXT

Dasar Tag HTML Form <html> <head> <title>Latihan 33</title> </head> <body> <form name=mhs_baru method=post action=proses.php> ……………… </form> </body> </html> BACK NEXT

Dasar Tag HTML Form Input Text: <input name=nama_input type=text size=lebar_input maxlength=kar._maks.> <html> <head> <title>Latihan 34</title> </head> <body> <h2>Form Mahasiswa</h2> <form name=form_mahasiswa> NIM<br> <input name=nim type=text size=20 maxlength=8><br> Nama Lengkap<br> <input name=nama type=text size=40> </form> </body> </html> BACK NEXT

Dasar Tag HTML Form Radio Button: <input name=nama_input type=radio checked> <html> <head> <title>Latihan 35</title> </head> <body> <form name=form_jeniskelamin> Jenis Kelamin:<br> <input name=gender type=radio checked> Laki-laki<br> <input name=gender type=radio> Perempuan </form> </body> </html> BACK NEXT

Dasar Tag HTML Form Check Box: <input name=nama_input type=checkbox checked> <html> <head> <title>Latihan 36</title> </head> <body> <form name=form_fak> Fakultas Ilmu Komputer:<br> <input name=si type=checkbox checked> Sistem Informasi<br> <input name=sk type=checkbox> Sistem Komputer </form> </body> </html> BACK NEXT

Dasar Tag HTML Form Drop-down List: <select name=nama_list> <option value=nama_opsi1>…</option> <option value=nama_opsi2>…</option> <option value=nama_opsi3>…</option> </select> BACK NEXT

Dasar Tag HTML Form Drop-down List: <html> <head> <title>Latihan 37</title> </head> <body> <form name=list> Level:<br> <select name=level> <option value=stand>Standart</option> <option value=prof>Professional</option> </select> </form> </body> </html> BACK NEXT

Dasar Tag HTML Form Textarea: <textarea name=nama_input rows=ukuran_tinggi cols=ukuran_lebar> </textarea> BACK NEXT

Dasar Tag HTML Form Textarea: <html> <head> <title>Latihan 38</title> </head> <body> <form name=alamat> Alamat:<br> <textarea name=alamat rows=4 cols=40> </textarea> </form> </body> </html> BACK NEXT

Dasar Tag HTML Form Button: <input type=submit/reset value=caption> Catatan: type=submit, akan mendefinisikan sebagai tombol untuk menyerahkan umpan balik. type=reset, akan mendefinisikan tombol untuk menghapus isi formulir. BACK NEXT

Dasar Tag HTML Form Button: <html> <head> <title>Latihan 39</title> </head> <body> <form name=frm_submit method=post action=latihan_39.html> Alamat:<br> <textarea name=alamat rows=4 cols=40> </textarea><br> <input type=submit value=Kirim>   <input type=reset value=Reset> </form> </body> </html> BACK NEXT

Dasar Tag HTML Soal (14) Tuliskan Source Code dari tampilan berikut: Catatan: Username dan Password panjang karakter = 10 BACK NEXT

Dasar Tag HTML Soal (15) Tuliskan Source Code dari tampilan berikut: Catatan: Event submit terletak pada list BACK NEXT

Dasar Tag HTML Soal (16) Tuliskan Source Code dari tampilan berikut: Catatan: Tombol submit bertipe gambar BACK NEXT

Dasar Tag HTML Soal (17) Tuliskan Source Code dari tampilan berikut: Catatan: Nama dan Alamat tidak dapat ditulisi BACK NEXT

Dasar Tag HTML Soal (18) Tuliskan Source Code dari tampilan berikut: Catatan: NIM dan Nama tidak bisa mendapatkan set focus BACK END

Dasar Tag HTML Tugas catatan: Buatlah suatu home page yang berisi biografi Anda dengan menggunakan notepad. Berilah nama file dokumen html dengan NIM Anda. misal: 04206063.html Kirim melalui e-mail: zakki_falani@yahoo.com catatan: Apabila dokumen Anda ternyata terbuat dari Web Editor selain notepad, maka tidak akan ada koreksi. END

Dasar Tag HTML Text Alignment <html> <head> <title>Latihan 05</title> </head> <body> <h1 align=center>Text Alignment</h1> <p align=center>Set in the centre of the window <p>Back to Normal <p align=right>Align to Right <p align=left>Align to Left </body> </html> BACK NEXT

Dasar Tag HTML Style pada Font <b>……</b> Tag ini untuk membuat bold (tebal) <i>.…..</i> Tag ini untuk membuat italic (miring) <u>…..</u> Tag ini untuk membuat underline (garis bawah) <tt>…..<tt> Tag ini untuk membuat huruf dengan efek mesin ketik (font Courier) BACK NEXT

Dasar Tag HTML Style pada Font <html> <head> <title>Latihan 07</title> </head> <body> <b>If you set words in bold</b> <p> <i>If you set words in italic</i> <p> <u>If you set words in underline</u> <p> <tt>If you set words in typewriter</tt> </body> </html> VIEW BACK NEXT

Dasar Tag HTML Background <html> <head> <title>Latihan 08</title> </head> <body bgcolor=blue> </body> </html> Catatan: *) Pemberian warna pada background dapat juga menggunakan kode heksadesimal VIEW BACK NEXT

Dasar Tag HTML Catatan: Browser akan mengabaikan spasi yang berlebihan. Sehingga Anda dapat membuat spasi sekehendak hati Anda untuk memudahkan pembacaan kode Anda. <html> <head> <title>Latihan 09</title> </head> <body> <h2>Words1  Words2</h2> </body> </html> BACK NEXT

Variasi bullet pada HTML: Dasar Tag HTML Bullet & Numbering Variasi bullet pada HTML: Disc, memberikan efek lingkaran (default) Square, memberikan efek persegi empat Circle, memberikan efek lingkaran yang transparan BACK NEXT

Dasar Tag HTML Bullet & Numbering <html> <head> <title>Latihan 10</title> </head> <body> <h3>Daftar Fakultas: <ul type=disc> <li>Fakultas Ekonomi</li> <li>Fakultas Hukum</li> <li>Fakultas Ilmu Komputer</li> <li>Fakultas Teknik Sipil</li> </ul> </h3> </body> </html> Catatan: ul = unordered list li = list item BACK NEXT

Dasar Tag HTML Bullet & Numbering <html> <head> <title>Latihan 11</title> </head> <body> <h3>Daftar Fakultas: <ul type=square> <li>Fakultas Ekonomi</li> <li>Fakultas Hukum</li> <li>Fakultas Ilmu Komputer</li> <li>Fakultas Teknik Sipil</li> </ul> </h3> </body> </html> BACK NEXT

Dasar Tag HTML Bullet & Numbering <html> <head> <title>Latihan 12</title> </head> <body> <h3>Daftar Fakultas: <ul type=circle> <li>Fakultas Ekonomi</li> <li>Fakultas Hukum</li> <li>Fakultas Ilmu Komputer</li> <li>Fakultas Teknik Sipil</li> </ul> </h3> </body> </html> BACK NEXT

Dasar Tag HTML Bullet & Numbering <html> <head> <title>Latihan 12</title> </head> <body> <h3>Daftar Fakultas: <ul type=circle> <li>Fakultas Ekonomi</li> <li>Fakultas Hukum</li> <li>Fakultas Ilmu Komputer</li> <li>Fakultas Teknik Sipil</li> </ul> </h3> </body> </html> BACK NEXT

Dasar Tag HTML Bullet & Numbering Daftar bernomor pada HTML: i adalah angka romawi kecil, misal: i,ii,iii,iv,dst I adalah angka romawi besar, misal: I,II,III,IV,dst a adalah huruf kecil, misal: a,b,c,d,dst A adalah huruf kapital, misal: A,B,C,D,dst 1 adalah angka dalam standar, misal: 1,2,3,4,dst BACK NEXT

Dasar Tag HTML Bullet & Numbering <html> <head> <title>Latihan 13</title> </head> <body> <h3>Daftar Fakultas: <ol type=A> <li>Fakultas Ekonomi</li> <li>Fakultas Hukum</li> <li>Fakultas Ilmu Komputer</li> <li>Fakultas Teknik Sipil</li> </ol> </h3> </body> </html> Catatan: ol = ordered list BACK NEXT

Dasar Tag HTML Bullet & Numbering <html> <head> <title>Latihan 14</title> </head> <body> <h3>Daftar Fakultas: <ol type=a> <li>Fakultas Ekonomi</li> <li>Fakultas Hukum</li> <li>Fakultas Ilmu Komputer</li> <li>Fakultas Teknik Sipil</li> </ol> </h3> </body> </html> BACK NEXT

Dasar Tag HTML Bullet & Numbering <html> <head> <title>Latihan 15</title> </head> <body> <h3>Daftar Fakultas: <ol type=I> <li>Fakultas Ekonomi</li> <li>Fakultas Hukum</li> <li>Fakultas Ilmu Komputer</li> <li>Fakultas Teknik Sipil</li> </ol> </h3> </body> </html> BACK NEXT

Dasar Tag HTML Bullet & Numbering <html> <head> <title>Latihan 16</title> </head> <body> <h3>Daftar Fakultas: <ol type=i> <li>Fakultas Ekonomi</li> <li>Fakultas Hukum</li> <li>Fakultas Ilmu Komputer</li> <li>Fakultas Teknik Sipil</li> </ol> </h3> </body> </html> BACK NEXT

Dasar Tag HTML Soal (4) Tuliskan Source Code dari tampilan berikut: VIEW BACK NEXT

Dasar Tag HTML Soal (5) Tuliskan Source Code dari tampilan berikut: VIEW BACK NEXT

Dasar Tag HTML Soal (6) Tuliskan Source Code dari tampilan berikut: VIEW BACK NEXT

Dasar Tag HTML Soal (7) Tuliskan Source Code dari tampilan berikut: VIEW END