Tutorial belajar HTML dasar ini kita tutup dengan sebuah halaman web dengan seluruh tag dan atribut yang telah kita pelajari dari tutorial part 1 sampai 14. Tag disini mencakup tag paragraf, heading, list, link, image (gambar), komentar, tabel dan form.
Berikut adalah rangkuman kode program sebuah halaman HTML. Ketiklah kode berikut dan save sebagai finish.html
Contoh rangkuman tag dasar html:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
| <!DOCTYPE html><html><head> <title>Summary HTML Dasar</title></head><body><!-- Akhirnya... Sebuah Halaman HTML Lengkap --><h1>Belajar HTML Dasar</h1><p> Ini <strong>adalah</strong> sebuah <em>paragraf</em> </p><!-- tag link --><p>Saya sedang belajar HTML dari <a href="http://www.duniailkom.com" target="_blank">Duniailkom</a> dan akan terbuka pada tab baru</p><!-- tag image --><img alt="gambar koala" src="koala.jpg" /><!-- tag list --><h2>Daftar Belanjaan</h2><ol> <li>Minyak Goreng</li> <li>Sabun Mandi</li> <li>Deterjen</li> <li>Shampoo</li> <li>Obat Nyamuk</li></ol><!-- tag table --><table border="1"><tr> <td>Baris 1, Kolom 1</td> <td>Baris 1, Kolom 2</td> <td>Baris 1, Kolom 3</td></tr><tr> <td>Baris 2, Kolom 1</td> <td>Baris 2, Kolom 2</td> <td> Baris 2, Kolom 3</td></tr><tr> <td> Baris 3, Kolom 1</td> <td> Baris 3, Kolom 2</td> <td> Baris 3, Kolom 3</td></tr><tr> <td> Baris 4, Kolom 1</td> <td> Baris 4, Kolom 2</td> <td> Baris 4, Kolom 3</td></tr></table><br/><!-- tag form --><form action="finish.html" method="get"> Nama: <input type="text" name="nama" value="Nama Kamu" /> <br /> Password: <input type="password" name="password" /> <br /> Jenis Kelamin : <input type="radio" name="jenis_kelamin" value="laki-laki" checked/> Laki - Laki <input type="radio" name="jenis_kelamin" value="perempuan" /> Perempuan <br /> Hobi: <input type="checkbox" name="hobi_baca" /> Membaca Buku <input type="checkbox" name="hobi_nulis" checked /> Menulis <input type="checkbox" name="hobi_mancing" /> Memancing <br /> Asal Kota: <select name="asal_kota" > <option value="Kota Jakarta"> Jakarta</option> <option>Bandung</option> <option value="Kota Semarang" checked>Semarang</option> </select> <br /> Komentar Anda: <textarea name="komentar" rows="5" cols="20"> Silahkan katakan isi hati anda</textarea> <br /> <input type="submit" value="Mulai Proses!" ></body></html> |
Jika anda telah mempelajari Tutorial Belajar HTML dari part 1 sampai part 14, seluruh kode HTML ini dapat dimengerti dengan mudah.
Walaupun kita telah mempelajari seluruh tag-tag umum dalam HTML, namun HTML masih menyimpan banyak tag-tag lain untuk kebutuhan yang lebih khusus. HTML juga makin berkembang dengan hadirnya HTML5.
Sampai disini anda boleh melanjutkan untuk mempelajari Tutorial HTML Lanjutan, dimana kita akan membahas tentang tag-tag yang lebih khusus. contohnya tag untuk menformat Text HTML, tag untuk membuat tabel HTML, dan tag untuk membuat Form HTML. Atau anda bisa langsung mempelajari tutorial dasar tentang CSS.
Dosen Desain Web 1 | Muqorobin, S.Kom
