Belajar HTML Part 17: Tutorial HTML Dasar (Finish)

Belajar HTML Part 17: Tutorial HTML Dasar (Finish)


Halo kawan-kawan,
Pada kesematan kali ini, mari kita meriview ulang semua yang telah kita pelajari sampai saat ini.


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>Rakuman HTML Dasar (Finish)</title>
</head>
<body>
<!-- Akhirnya... Sebuah Halaman HTML Lengkap -->
<h1>Belajar HTML Dasar</h1>
<p> Ini adalah sebuah paragraf </p>

<!-- tag link -->
<p>Saya sedang belajar HTML dari 
<a href="https://nusantaracoding.blogspot.co.id/" target="_blank">Nusantara Coding</a><br/>
atribut target berguna agar ketika di klick link membuka tab baru</p>

<!-- tag image -->
<img alt="Benner" src="PPD.png" />

<br/>
<!-- tag Video -->
<video width="400px" height="350px" controls>
  <source src="Belajar HTML Part 1 Pengertian HTML.mp4">
 </video>

<!-- tag list -->
<h2>Daftar Keahlian</h2>
<ol>
   <li>HTML</li>
   <li>CSS</li>
   <li>PHP</li>
   <li>Java Script</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 Sampaikan Pendapat Anda Tentang Tutorial HTML ini di Kolom Komentar</textarea>
   <br />

   <input type="submit" value="Mulai Proses!" >
</form>
</body>
</html>

Hasil Code:

Kode-kode diatas adalah kode-kode HTML yang secara umum sering akan kita jumpai dalam pembuatan sebuah website, namun HTML sendiri masih menyimpan tag-tag lain dengan fungsi-fungsi khususnya sendiri-sendiri. Ditambah lagi dengan hadirnya HTML5.



Sampai disini kita 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.

Belajar HTML Secara Lengkap Disini: