List

Elemen list digunakan untuk membuat suatu list atau daftar. HTML menyediakan dua jenis list, yaitu ordered list (list berurutan) dan unordered list (list tidak berurutan). Setelah elemen list dibuat, kita bisa mengisinya dengan list item sebanyak yang diinginkan. Tag <li> digunakan untuk membuat list item.

List Berurutan

Tag <ol> atau ordered list digunakan untuk membuat list yang berurutan.

<ol>
    <li>Jakarta</li>
    <li>Surabaya</li>
    <li>Denpasar</li>
</ol>

Secara default urutan list ditentukan dengan angka. Jika ingin mengubah jenis urutan, kita bisa memanfaatkan aturan-aturan pada css, yaitu : list-style-type.

<style>
    ol {
        list-style-type: lower-latin;
    } 
</style>
<ol>
    <li>Jakarta</li>
    <li>Surabaya</li>
    <li>Denpasar</li>
</ol>

Ada banyak tipe list-style, saya akan menuliskan beberapa yang sering digunakan, yaitu : decimal-leading-zero, lower-latin, lower-roman, upper-latin, dan upper-roman.

List Tidak Berurutan

Tag <ul> atau unordered list digunakan untuk membuat list yang tidak berurutan.

<ul>
    <li>Jakarta</li>
    <li>Surabaya</li>
    <li>Denpasar</li>
</ul>

Secara default urutan list ditentukan dengan disc. Jika ingin mengubah tipe list, kita bisa memanfaatkan aturan-aturan pada css, yaitu : list-style-type.

<style>
    ul {
        list-style-type: circle;
    }
</style>

<ul>
    <li>Jakarta</li>
    <li>Surabaya</li>
    <li>Denpasar</li>
</ul>

Tipe list-style untuk unordered list yang sering digunakan adalah: circle, square, dan none.

Last updated

Was this helpful?