HTML List
Pada umumnya list digunakan untuk membuat sebuah daftar nama-nama yang saling berhubungan. Contohnya adalah ketika kita ingin membuat sebuah list sayuran dan buah-buahan, yang mana nantinya di list buah-buahan ada nama-nama buah seperti mangga, rambutan, semangkan dan lainnya. Itulah yang disebut dengan list.
Ketika kita mengerjakan sebuah tugas sekolah menggunakan word tentunya ada saja yang membutuhkan list. Pastinya kalian sudah tau bagaimana cara membuat list di word, sekarang mari kita coba membuat list pada HTML.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<ul>
<li>List pertama</li>
<li>List kedua</li>
<li>List ketiga</li>
<li>List keempat</li>
<li>List kelima</li>
</ul>
<ol>
<li>List pertama</li>
<li>List kedua</li>
<li>List ketiga</li>
<li>List keempat</li>
<li>List kelima</li>
</ol>
<dl>
<dt>Kopi</dt>
<dd>- Kapal api</dd>
<dd>- Kapal indocafe</dd>
<dd>- Kapal abc susu</dd>
<dt>Buah</dt>
<dd>- Semangka</dd>
<dd>- Melon</dd>
<dd>- Rambutan</dd>
</dl>
</body>
</html>
Keterangan :
ul = Mendefinisikan daftar yang tidak berurutan, maksud tidak berurutan adalah tanda yang menunjukan tidak ada keterangan list yang pertama atau kedua yang lainnya. Tanda list bisa kita lihat yang hitam bulat seperti pada gambar.
ol = Mendefinisikan daftar yang berurutan. Bisa kita lihat pada gambar diatas list pertama dimulai pada angka 1 dan seterusnya sampai angka 5.
li = Mendefinisikan daftar list baru. Jadi jika kita ingin membuat list baru maka kita menggunakan tag li.
dl = Mendefinisikan deskripsi list. Jadi jika kita ingin membuat sebuah list yang mana itu menyangkut sebuah kelompok, contohnya seperti kelompok buah-buahan maka harus menggunakan tag dl.
dt = Mendefinisikan nama kelompok list. Contoh penggunakan dt seperti pada gambar diatas adalah pada kopi dan buah.
dd = Mendefinisikan list baru pada nama kelompok. Kegunaannya sama seperti li.
Kepanjangan setiap tag lis :
ul = unordered list.
ol = ordered list
li = list item
dl = description list
dt = description terms
Nah itulah macam-macam list yang bisa kalian coba pada webite kalian. Selamat mencoba....