Manakah tag html yang digunakan untuk membuat daftar list berurutan?

Kalian pernah ngetik di microsoft word dan menggunakan Bullets and Numbering? Kalian gunakan untuk apa Bullets and Numberingnya? Bullets and Numbering digunakan untuk membuat daftar, seperti daftar makanan, daftar hobi dan lain sebagainya yang disusun dengan penomoran atau simbol. Pada HTML ini dikenal dengan nama List.

Apa itu List di HTML?

Pada HTML, list adalah elemen yang digunakan untuk menampilkan informasi dalam bentuk list atau daftar, bisa berupa simbol (Bullet) atau nomor urut (Numbering). List HTML bisa juga digunakan untuk membuat menu navigasi pada halaman website.

Jenis List di HTML

Di dalam HTML ada tiga jenis list yaitu:

1. Ordered List <ol></ol> adalah list yang terurut;
2. Unordered List <ul></ul> adalah list yang tak terurut;
3. Definition List <dl></dl> adalah list yang berisi definisi.

Dalam pembahasan pada tutorial ini kita akan menggunakan ketiganya untuk latihan. Namun pada praktek nyatanya kalian nanti dapat memilih dan menyesuaikan sendiri penggunaannya.

Cara Menggunakan Ordered List di HTML

Ordered list adalah sebuah list yang terurut. List ini ditandai dengan angka atau huruf di depannya sebagai penanda bahwa list ini terurut. Untuk membuat Ordered list kalian dapat membuatnya dengan tag <ol>. Di dalam <ol> terdapat sub elemen untuk menentukan item listnya yaitu dengan menggunakan Tag <li> (list item).

Contoh Penggunaan Ordered List:

Kode HTML di atas akan menghasilkan tampilan seperti berikut:

Tampilan Ordered List

Secara default Ordered List <ol></ol> akan menghasilkan tampilan daftar terurut dengan nomor, seperti contoh di atas menghasilkan urutan 1 sampai dengan 8. Kita juga dapat menyesuaikan tipe penomorannya misalkan menginginkan huruf a, b, c dan seterusnya, atau I, II, III dan seterusnya. Caranya tinggal menambahkan atribut type di Tag awal <ol>, dengan format <ol type=”…”></ol>.

Buatlah kode HTML berikut ini untuk mencoba Atribut type.

Hasil dari kode di atas dapat dilihat pada gambar berikut ini.

Ordered List Type

Cara Menggunakan Unordered List di HTML

Unordered List adalah daftar/list item yang tidak memiliki urutan atau urutan khusus. Daftar ini dibuat dengan menggunakan tag HTML <ul>. Setiap item dalam daftar ditandai dengan simbol-simbol.

Kalian bisa menggunakan atribut type untuk tag <ul> untuk menentukan tipe bullet/simbol yang kalian inginkan. Secara default, ini adalah disc. Beberapa opsi type yang kalian bisa gunakan adalah circle, square dan disc.

Berikut ini contoh penggunakan unordered List <ul></ul>

Dari kode diatas akan menampilkan halaman seperti pada gambar berikut ini.

Hasil Unordered List HTML

Menggunakan Definition List di HTML

Selain Ordered List dan Unordered List, Pada HTML mendukung daftar/list yang disebut daftar definisi di mana entri terdaftar seperti dalam kamus atau ensiklopedia. Daftar definisi cocok digunakan untuk menyajikan glosarium, daftar istilah, atau daftar nama/nilai lainnya.

Daftar Definisi menggunakan tiga tag berikut.

• <dl> – Menentukan awal daftar
• <dt> – Istilah
• <dd> – Definisi istilah
• </dl> – Menentukan akhir daftar

Cohtoh Penggunaan Definition List pada HTML

Hasil dari kode di atas adalah sebagai berikut.

Hasil Definition List HTML

Itulah Cara Membuat List di HTML untuk menyajikan informasi dalaman bentuk daftar/list. Mudah-mudahan bermanfaat.