CARA MEMBUAT LIST DI HTML

Jika kamu baru mulai belajar HTML, salah satu hal pertama yang harus kamu kuasai adalah bagaimana cara membuat list. Ada dua jenis utama dari list HTML yaitu list terurut (ordered list) dan list tidak terurut (unordered list).

List terurut adalah list yang item-itemnya ditampilkan dalam urutan tertentu, biasanya ditampilkan dengan angka atau huruf. Sedangkan, list tidak terurut adalah list yang item-itemnya tidak memiliki urutan tertentu dan biasanya ditampilkan dengan simbol-simbol seperti bullet points.

Membuat List Tidak Terurut di HTML

Untuk membuat list tidak terurut di HTML, kamu perlu menggunakan elemen <ul> dan <li> dalam kode HTML kamu. <ul> adalah singkatan dari Unordered List, sementara <li> adalah singkatan dari List Item.

Berikut adalah struktur dasar dari list tidak terurut:

<ul>
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
</ul>

Pada struktur di atas, tag <ul> digunakan untuk mendeklarasikan awal dan akhir list, sedangkan tag <li> digunakan untuk mendeklarasikan setiap item pada list tersebut.

Membuat List Terurut di HTML

Membuat list terurut pada HTML juga sama mudahnya dengan membuat list tidak terurut. Perbedaannya hanya terletak pada tag yang digunakan. Untuk list terurut, kamu menggunakan tag <ol> yang merupakan singkatan dari Ordered List.

Berikut adalah struktur dasar dari list terurut:

<ol>
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
</ol>

Mirip dengan list tidak terurut, kamu menggunakan tag <li> untuk mendefinisikan setiap item pada list.

Menggabungkan List Terurut dan Tidak Terurut

Salah satu kelebihan HTML adalah fleksibilitasnya. Kamu bisa dengan mudah menggabungkan list terurut dan tidak terurut dalam satu list besar. Berikut adalah contoh bagaimana cara melakukannya:

<ul>
  <li>Item 1</li>
  <li>
    <ol>
      <li>Subitem 1</li>
      <li>Subitem 2</li>
    </ol>
  </li>
  <li>Item 3</li>
</ul>

Pada contoh di atas, kita memiliki list tidak terurut dengan tiga item. Item kedua dari list tersebut memiliki list terurut sendiri dengan dua subitem.