Element List merupakan salah satu yang sering digunakan dalam pembuatan sebuah website. elemen list memungkinkan untuk mengorganisir informasi secara terstruktur, sehingga mudah dipahami oleh audience atau pengguna.
Kali ini kita akan mempelajari list HTML dari mulai penggunaanya dan berbagai jenis list yang dapat digunakan.
Element List HTML |
Pengenalan Elemen List HTML
Element list ini biasa digunakan untuk menyusun elemen-elemen berdasarkan hubungan atau keterkaitan diantara mereka. dengan begitu developer dapat membuat informasi secara terstruktur atua hierarki sehingga mudah dipahami oleh penggunanya.
Jenis-jenis Elemen List HTML
Ada tiga jenis elemen list yaitu
1. Ordered List (List Berurutan)
Ordered list biasa digunakan untuk menampilkan daftar item yang memiliki urutan atau nomor tertentu. elemen tersebut dikelompokan pada elemen <ol> dan didalamnya terdapat item yang ditandai dengan elemen <li>.
contoh penggunaanya
<ol>
<li>list 1</li>
<li>list 2</li>
<li>list 3</li>
</ol>
Hasilnya
- list 1
- list 2
- list 3
2. Unordered List (List Tidak Berurutan)
Undordered list ini kebalikan dari ordered list yaitu menampilkan daftar item tanpa adanya urutan tertentu. elemen tersebut dikelompokan pada elemen <ul> dan didalamnya terdapat item yang ditandai dengan elemen <li>
contoh penggunaanya
<ul>
<li>list 1</li>
<li>list 2</li>
<li>list 3</li>
</ul>
Hasilnya
- list 1
- list 2
- list 3
3. Description List (List Deskripsi)
Description list ini biasa digunakan untuk menyajikan item berserta deskripsinya. elemen tersebut dikelompokan pada elemen <dl> dan di dalamnya terdapat elemen <dt> (definition list) dan didalamnya terdapat elemen <dd> (definition Description).
Contoh penggunannya
<dl>
<dt>HTML</dt>
<dd>Hypertext Markup Language</dd>
<dt>CSS</dt>
<dd>Cascading Style Sheets</dd>
<dt>JS</dt>
<dd>Javscript</dd>
</dl>
Hasilnya
HTML
Hypertext Markup Language
CSS
Cascading Style Sheets
JS
Javascript
Atribut Elemen List HTML
Elemen list ini terdapat fitur mengenai penggunaan atribut. ada beberapa atribut yang umum digunakan yaitu:
1. Atribut type (Ordered List)
Atribut type ini digunakan pada elemen <ol> untuk menentukan jenis pengurutannya. untuk nilainya antara lain adalah 1 (angka) , A (huruf kapital), a (huruf kecil), I (romawi kapital), dan i (romawi kecil).
contoh penggunaanya
<ol type="I">
<li>list 1</li>
<li>list 2</li>
<li>list 3</li>
</ol>
Hasilnya
2. Atribut start (Ordered List)
Atribut start digunakan pada elemen <ol> untuk menetukan nilai awal urutan, sangat berguna jika inigin memulai urutan dari angka tertentu.
contoh pengunannya
<ol start="2">
<li>list 1</li>
<li>list 2</li>
<li>list 3</li>
</ol>
Hasilnya
Kesimpulan
Dengan menguasai penggunaan Elemen List jenis Ordered List, Unordered List dan Decription List beserta atribut yang umum digunakan, diharapkan bisa meningkatkan kualitas struktur konten halaman.
Silahkan uji coba elemen list tersebut dan beberapa atributnya sehingga anda bisa menyesuaikan jenis elemen list yang dibutuhkan.
Semoga artikel ini membantu memhami mengenai Elemen List dan mengimplementasikan pada proyek website anda agar optimal.
Posting Komentar