Dhika_Blog: Membuat List atau Daftar dengan HTML

Seringkali kita melihat daftar yang misalnya seperti ini:

Daftar Buku Sejarah dan Pahlawan Kemerdekaan:

Pangeran Diponegoro
Perang Padri
Teuku Umar
Wolter Monginsidi
Dan Lain-lainnya

Atau yang seperti ini:
Daftar Buku Sejarah dan Pahlawan Kemerdekaan:

Pangeran Diponegoro
Perang Padri
Teuku Umar
Wolter Monginsidi
Dan Lain-lainnya

Nah, untuk membuat list atau daftar yang seperti ini dengan html caranya adalah dengan tag <ul></ul> yang disebut Unordered List atau dengan tag <ol></ol> yaitu Ordered List.

Beda antara <ol></ol> dan <ul></ul> adalah bahwa Ordered List <ol></ol> menghasilkan daftar dengan nomor urut 1,2,3 dst sedangkan Unordered List <ul></ul> hasilnya tanpa nomor.

Sekarang kita membuat list atau daftar dengan tag <ul></ul> supaya memperoleh hasil seperti diatas.

<strong>Daftar Buku Sejarah dan Pahlawan Kemerdekaan:</strong>
<ul>
<li>Pangeran Diponegoro</li>
<li>Perang Padri</li>
<li>Teuku Umar</li>
<li>Wolter Monginsidi </li>
<li>Dan Lain-lainnya</li>
</ul>

Hasilnya adalah seperti ini:

Daftar Buku Sejarah dan Pahlawan Kemerdekaan:

Pangeran Diponegoro

Perang Padri

Teuku Umar

Wolter Monginsidi

Dan Lain-lainnya

Supaya kita tahu perbedaannya, maka tag <ul></ul> kita ganti dengan tag <ol></ol>
kita lihat kode htmlnya sekarang menjadi seperti ini:

<strong>Daftar Buku Sejarah dan Pahlawan Kemerdekaan:</strong>
<ol>
<li>Pangeran Diponegoro</li>
<li>Perang Padri</li>
<li>Teuku Umar</li>
<li>Wolter Monginsidi </li>
<li>Dan Lain-lainnya</li>
</ol>

Lihatlah…… Sekarang hasilnya adalah seperti dibawah ini: