Penggabungan Dasar Dasar HTML (Part XV)

Kamis, 15 Desember 2011

Setelah belajar dasar-dasar dari HTML, kita juga harus bisa menggabungkannya menjadi satu dengan sebuah halaman web dengan seluruh tag dan atribut yang telah kamu pelajari.

Berikut adalah rangkuman kode program sebuah halaman HTML. Ketiklah kode berikut dan save sebagai finish.html

Contoh rangkuman tag dasar html:

<!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="https://cowaska.blogspot.co.id" target="_blank">Coretan Waska</a>
dan akan terbuka pada tab baru</p>

<!-- tag image -->
<img alt="CoreanWaska" src="CoretanWaska.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>

Output:

Jika kamu telah mempelajari Belajar HTML dari dari urutan awal, seluruh kode HTML ini dapat dimengerti dengan mudah.

Walaupun kamu 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.

Cowaska

Penggabungan Dasar Dasar HTML (Part XV)

Blogpost Kamis, 15 Desember 2011 edit Tags: Belajar HTML