Belajar HTML Part 10: Cara Membuat Daftar/List di HTML (tag ol, ul dan li)
Halo Kawan-kawan,
Pada kesempatan kali ini, kita akan belajar Cara Membuat Daftar/List dengan HTML mengunakan tag ol, ul dan li.
Cara Membuat Daftar/List di HTML
Dalam HTML disediakan 2 jenis tag untuk membuat Daftar/List yaitu: ordered list (berurutan) dan unordered list (tidak berurutan). Ordered list akan ditampilkan dengan angka atau huruf, sedangkan unordered list dengan bulatan atau kotak.
Untuk Lebih Mudah, Langsung Saja Lihat Contoh Codenya:
<!DOCTYPE html>
<html>
<head>
<title>penggunaan tag list </title>
</head>
<body>
<h1>Daftar Dengan Angka MenggunakanTag ol</h1>
<ol>
<li>Daftar No Pertama</li>
<li>Daftar No Kedua</li>
<li>Daftar No Ketiga</li>
<li>Daftar No Keempat</li>
<li>Daftar No Kelima</li>
</ol>
<br />
<br />
<h1>Daftar Dengan Angka MenggunakanTag ul</h1>
<ul>
<li>Daftar No Pertama</li>
<li>Daftar No Kedua</li>
<li>Daftar No Ketiga</li>
<li>Daftar No Keempat</li>
<li>Daftar No Kelima</li>
</ul>
</body>
</html>
Hasil:
Dengan melihat kode diatas, Kita menjadi tahu ordered list menggunakan tag <ol>, dan unordered list menggunakan tag <ul>, sedangkan untuk list sendiri menggunakan tag <li>.
Penggunaan tag list pada HTML tidak hanya untuk membuat daftar saja. Dengan CSS, tag list dapat digunakan untuk membuat menu navigasi di dalam halaman web, seperti menu home, contact us, dll. Tag list juga dapat digunakan untuk nested list, atau list bersarang, yang artinya sebuah list yang berada di dalam list lainnya.
Oke, demikian toturial tentang Cara Membuat Daftar/List di HTML (tag ol, ul dan li), selanjutnya kita akan belajar tag <a> untuk membuat link di HTML.
Belajar HTML Secara Lengkap Disini:
1. Tutorial HTML Bagian 1
2. Tutorial HTML Bagian 2