HTML Dasar Part 15 : Penerapan Semua Tag HTML Dasar

By -

HTML Dasar Part 15: Penerapan Semua Tag HTML Dasar


Pada tutorial sebelumnya, kita telah membahas mengenai cara membuat form di HTML. Tidak terasa, ternyata sudah banyak kita belajar dasar-dasar seputar HTML. Tutorial kali ini adalah penutup dari tutorial-tutorial HTML Dasar. Agan / aganwati yang telah sampai pada tutorial ini pasti adalah orang-orang yang benar ingin belajar. Saya apresiasi buat kalian, nice learn.
So, sebagai penutup tutorial HTML Dasar, mahaamesha.com akan memberikan contoh kode HTML yang menerapkan seluruh tag pada tutorial Part 1 hingga 14. Coba kita review, kita telah belajar tag paragraf, tag heading, tag list, tag link, tag img, tag table, tag note, dan tag form.
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
<!DOCTYPE html>
<html>
<head>
          <title>Ma Haamesha | Summary</title>
</head>
<body>

<!-Tag Heading->
          <h1>Penerapan Semua Materi Dasar</h1>
         
<h2>Tag Paragraf</h2>
<p>Kali ini <b>mahaamesha.com</b> akan menerapkan
<u>semua materi</u> tutorial <i>part 1 s.d. 14</i>.</p>

<h2>Tag List & Table</h2>
<p>Summary of :<br/>
<table width="40%" bgcolor="lightgreen">
<tr><td>
          <ul><ol>
          <li>Tag Paragraf</li>
          <li>Tag Heading</li>
          <li>Tag List</li>
          <li>Tag Link</li>
          </ol></ul>
</td><td>
          <ol><ul>
          <li>Tag Img</li>
          <li>Tag Tabel</li>
          <li>Tag Note</li>
          <li>Tag Form</li>
          </ul></ol></p>
</td></tr>
</table>

<h2>Tag Link</h2>
<p><a href="http://mahaamesha.blogspot.com" target="blank">Click here, please!</a><br/>
<a href="Lampu.png" alt="Gambar Lampu" target="blank">Click me</a><br/>
Klik link di atas dan akan muncul gambar di bawah ini.</p>

<h2>Tag Img</h2>
<!-Saya telah menyimpan file "Lampu.png" dalam satu folder dengan file "Semua Dasar.html"->
<img src="Lampu.png">

<h2>Tag Note</h2>
<!-Agan / aganwati bisa membaca tag note di open source->
<p>Di atas paragraf ini ada tag note. Kelihatan?<p>

<h2>Tag Form</h2>
<a href="Formjadi.html">Form Part 14</a>
<!-Saya menjadikan "Formjadi.html" menjadi satu folder dengan file html saat ini->
Mohon diisi ya gan. Thanks
<form method="get" action="http://mahaamesha.blospot.com">
<p><b>Apakah tutorial saya mudah dipahami?</b><br/>
<input type="radio" name="paham"/>Ya
<input type="radio" name="paham"/>Tidak</p>
<p><b>Manakah tutorial tersulit dipahami?<br/>
<table width="40%"><tr><td>
<input type="radio" name="sulit"/>Tag Paragraf<br/>
<input type="radio" name="sulit"/>Tag Heading<br/>
<input type="radio" name="sulit"/>Tag List<br/>
<input type="radio" name="sulit"/>Tag Link<br/>
</td><td>
<input type="radio" name="sulit"/>Tag Img<br/>
<input type="radio" name="sulit"/>Tag Tabel<br/>
<input type="radio" name="sulit"/>Tag Note<br/>
<input type="radio" name="sulit"/>Tag Form<br/>
</td></tr></table>
<p><b>Manakah tema informasi favorit Agan / Aganwati?</b><br/>
<input type="checkbox"/>Lifestyle<br/>
<input type="checkbox"/>Sport (gym)<br/>
<input type="checkbox"/>Computer<br/>
<input type="checkbox"/>Sains-Tech<br/>
<input type="checkbox"/>
<input type="text" value="Other"/>* Write here, please</p>
<p><b>Apakah Agan / Aganwati puas berkunjung di sini?</b><br/>
<input type="radio" name="mark"/>Ya
<input type="radio" name="mark"/>Mungkin
<input type="radio" name="mark"/>Tidak<br/>
<p><b>Saran untuk Ma Haamesha :</b><br/>
<textarea rows="7" cols="45%">
Agan / aganwati bisa memberikan saran di sini
</textarea></p>
<input type="submit"/ Value="Submit">
</form>
</body>
</html>
Setelah itu, save dengan format .hmtl. Kemudian launch di web browser.
Perlu digarisbawahi, untuk memudahkan dalam hal penghubungan link dan sumber, pada contoh di atas, saya menjadikan semua file gambar dan HTML yang akan ditampilkan menjadi satu buah folder. Ini akan membantu agan / aganwati dalam penulisan kode.
----------------------------------------------------------------------------------------------------
Dengan tutorial ini, maka tutorial Dasar HTML telah selesai. Namun, ini bukan berarti untuk belajar HTML cukup sampai di sini. Masih banyak sekali materi seputar HTML di dunia pemrogaman. Apalagi bagi kalian yang ingin menjadi seorang web master. Setidaknya perlu belajar HTML, CSS, JavaScript, PHP, MySQL, Database, dll. Semua itu akan saya bahas. So, simak terus mahaamesha.com bagi kalian yang haus akan informasi.


Created by mahaamesha :}

Comments

Post a Comment