Belajar HTML Dasar Part 15: Tutorial HTML Dasar (Finish)

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:

<!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" selected>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>

Tutorial HTML Dasar (Finish)

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.


HTML Uncover - Banner

eBook HTML Uncover Duniailkom

Apabila anda membutuhkan tutorial HTML yang lebih lengkap dan detail, Duniailkom telah menerbitkan eBook HTML Uncover.

eBook setebal 360 halaman A4 ini akan memandu anda menguasai HTML dari dasar hingga fitur terbaru dari HTML 5 seperti <canvas>, <audio>, <video> serta proses validasi form. Semuanya dibahas lengkap disertai contoh program dan tampilan gambar.

Penjelasan lebih lanjut tentang eBook ini bisa mengunjungi: HTML Uncover – Panduan Belajar HTML Lengkap untuk Pemula


Tutorial Terkait:

95 Comments

  1. Lukman
    29 Oct 14
    • Andre
      31 Oct 14
  2. Umar
    09 Nov 14
  3. Capt Akromi
    24 Dec 14
  4. yogiwiratania
    25 Jan 15
  5. rangga
    28 Feb 15
  6. Takde Nama
    18 Mar 15
    • Andre
      19 Mar 15
  7. Ifan
    04 May 15
  8. Riki Schluster
    24 May 15
  9. Misdal
    31 May 15
    • Andre
      31 May 15
  10. Sandi Rosandi
    03 Jun 15
    • Andre
      04 Jun 15
  11. Novias Candra Gunawan
    12 Jun 15
    • Andre
      13 Jun 15
  12. sabda awal
    23 Jul 15
  13. fidel
    03 Sep 15
  14. Ardine gantengg
    20 Sep 15
  15. Hairul Lana
    21 Sep 15
    • Andre
      21 Sep 15
  16. david
    22 Sep 15
    • Andre
      22 Sep 15
  17. yano
    28 Sep 15
  18. ucok
    23 Oct 15
  19. ucok
    23 Oct 15
  20. Rizaldy Info
    09 Dec 15
  21. vendi
    15 Dec 15
    • Andre
      15 Dec 15
  22. KzN
    30 Dec 15
  23. Anonymous
    21 Jan 16
  24. Orang Tamvan
    11 Feb 16
    • Andre
      12 Feb 16
  25. Blog Builder
    15 Feb 16
    • Andre
      18 Feb 16
  26. Kurniawan Shidiq
    06 Mar 16
  27. sadat fauzi
    13 Mar 16
    • Andre
      15 Mar 16
  28. Taufik suroso
    25 Mar 16
    • Andre
      26 Mar 16
  29. imay
    03 Apr 16
  30. Mronerr
    19 May 16
  31. Martino Rizki R
    19 May 16
    • Andre
      20 May 16
  32. ade achmad a
    15 Jun 16
    • Andre
      15 Jun 16
  33. fahmy michy
    27 Jun 16
    • Andre
      27 Jun 16
  34. Ditt Clev
    11 Jul 16
  35. Silent Reader
    17 Aug 16
    • Andre
      18 Aug 16
  36. Yadin
    06 Sep 16
  37. Surono
    07 Sep 16
    • Andre
      07 Sep 16
  38. Baey
    05 Oct 16
    • Andre
      05 Oct 16
  39. Anonymous
    05 Oct 16
  40. jhon
    18 Nov 16
    • Andre
      19 Nov 16
  41. Anonymous
    21 Nov 16
    • Andre
      23 Nov 16
  42. cucut
    21 Nov 16
    • Andre
      23 Nov 16
  43. Arif Putro
    30 Nov 16
    • Andre
      01 Dec 16
  44. blog post
    30 Nov 16
    • Andre
      01 Dec 16
  45. Anonymous
    12 Dec 16
    • Andre
      13 Dec 16
  46. shahibul ihsan
    29 Dec 16
  47. Agil
    09 Jan 17
  48. Muara Sihombing
    06 Feb 17
    • Andre
      06 Feb 17
  49. assek
    16 Feb 17
  50. lubbiy
    27 Mar 17
  51. Dwi Putra
    08 May 17
    • Andre
      08 May 17
  52. Daemon
    17 May 17
    • Andre
      18 May 17
  53. Tri
    15 Jun 17
    • Andre
      17 Jun 17
  54. rivaldi
    19 Jul 17
    • Andre
      21 Jul 17
  55. andyka
    13 Aug 17
    • Andre
      16 Aug 17
  56. ardi
    19 Aug 17
    • Andre
      20 Aug 17
  57. oddandri
    20 Sep 17
    • Andre
      22 Sep 17

Add Comment