Daftar atau list diperlukan untuk menampilkan informasi yang bersifat berurutan, dan biasanya ditampilkan dalam bentuk daftar. HTML menyediakan beberapa tipe daftar, yaitu daftar tanpa nomor atau unordered list atau disebut juga bulleted list, daftar dengan nomor atau ordered list atau disebut juga numbered list, dan daftar untuk definisi atau disebut juga sebagai definition list.

  • UL
Bagian pertama ini akan diberikan contoh penggunaan daftar tanpa nomor yang dapat dibuat dengan cara berikut. Tag untuk membuat daftar dalam bentuk bullet atau unorder list dimulai dengan <ul> kemudian untuk menampilkan daftar butir-butir yang diinginkan digunakan perintah <li> dan untuk mengakhiri pembuatan daftar ditutup dengan </ul>.

Contoh :

<html>
<head>
<title>Daftar Bullet</title>
</head>
<body>
Membuat list
<ul>
<li>Daftar pertama
<li>Daftar kedua
<li>Daftar ketiga
<li>Daftar keempat
</ul>
</body>
</html>

Unordered list yang disebut juga sebagai bulleted list, mempunyai tanda bullet default berupa noktah.

  • OL
Bagian kedua ini akan diberikan contoh penggunaan daftar yang menggunakan atau disebut juga sebagai ordered list. Cara membiuat daftar seperti ini adalah menggunakan tag awal <ol>, kemudian untuk menampilkan daftar butir-butir yang diinginkan digunakan perintah <li> dan untuk mengakhiri ditutup dengan </ol>.

Contoh :

<html>
<head>
<title>Daftar Angka</title>
</head>
<body>
Membuat list
<ol>
<li>Satu
<li>Dua
<li>Tiga
<li>Empat
</ol>
</body>
</html>

Kita dapat mengubah pembuatan daftar menggunakan nomor atau ordered list menggunakan model yang lain, yaitu dengan cara menambahkan atribut type <ol> tersebut. Dibawah ini tipe-tipe lain yang digunakan :


Contoh penggunaannya :

<html>
<head>
<title>Tipe</title>
</head>
<body>
<ol type=I>
<li>Tipe Huruf Romawi Besar
</ol>
<ol type=i>
<li>Tipe Huruf Romawi Kecil
</ol>
<ol type=A>
<li>Tipe Abjad Menggunakan Huruf Besar
</ol>
<ol type=a>
<li>Tipe Abjad Menggunakan Huruf Kecil
</ol>
</body>
</html>

  • DD, DL, dan DT
Bagian ketiga diberikan contoh pembuatan daftar definisi atau definition list yang menggunakan tag <dl>, yang terdiri atas definition term dengan tag <dt>, dan definition definition dengan tag <dd>.

Contoh :

<html>
<head>
<title>Daftar Definisi</title>
</head>
<body>
<dl>
<dt>HTML
<dd>HyperText Markup Language (HTML) adalah bahasa inti dari hampir semua konten Web. Sebagian besar dari apa yang Anda lihat pada layar browser anda adalah sebuah deskripsi, secara mendasar, menggunakan HTML. Lebih tepatnya, HTML adalah bahasa yang menggambarkan struktur dan isi semantik dari sebuah dokumen Web.
<dt>CSS
<dd>Cascading Style Sheets, dikenal juga sebagai CSS, adalah bahasa stylesheet yang digunakan untuk merubah tampilan dokumen yang terulis dalam HTML atau XML (termasuk variasi bahasa XML seperti SVG atau XHTML). CSS menjelaskan bagaimana elemen terstruktur yang harus ditampilkan di layar, di kertas, dalam cara komunikasi, atau dalam media yang lain.
</dl>
</body>
</html> 

  • Nested List
Bagian keempat diberikan contoh pembuatan nested list, merupakan suatu daftar yang terdiri atas daftar utama yang diikuti dengan sub-daftar, dan yang kemudian dapat diikuti dengan sub-sub-daftar lagi. Untuk membuat nested list, kita dapat menggunakan unordered list atau ordered list, dan dapat juga menggabungkan keduanya.

Contoh nested list menggunakan gabungan antara unordered list dan ordered list :

<html>
<head>
<title>Nested List</title>
</head>
<body>
<ul type=disk>
<li>Daftar Merk Handphone
<ol type=1>
<li>Nokia
<li>Samsung
</ol>
<li>Daftar Stasiun TV
<ol type=A>
<li>NET TV
<li>RCTI
<li>TRRANS TV
</ol>
<li>Daftar Merk Sepeda Motor
<ol type=a>
<li>Honda
<li>Yamaha
</ol>
</ul>
</body>
</html>