Mengenal Jenis-Jenis List pada HTML
Hai teman-teman! Jumpa lagi nih bersama mimin. Masih semangat kan belajar codingnya? Harus dong! Kali ini topik yang akan kita bahas adalah tentang jenis-jenis serta cara membuat list atau daftar pada HTML. Penasaran? Tanpa berlama-lama, simak artikel berikut ini.
Kalian pastinya sudah tahu apa itu list. Daftar yang disusun menurun yang berisikan sejumlah nama atau objek ini sudah biasa kita gunakan di dalam kehidupan sehari-hari pun kita sering membuatnya, mulai dari daftar nama, belanja, aktivitas, dan lain-lain. Sama halnya dengan HTML, kita juga bisa membuat daftar melalui text editor kita yang nantinya akan ditampilkan pada peramban. Di HTML, list dibagi menjadi beberapa macam. Diantaranya :
1. Ordered List
Tag-tag utama yang digunakan untuk membuat daftar diantaranya adalah <ol> atau <ul>,dan<li>, Namun disini tag yang akan kita gunakan adalah tag <ol> dan <li>. <ol> sendiri merupakan kepanjangan dari Ordered List atau Daftar berurutan. Maksudnya berurutan disini adalah seperti kita mengurutkan angka dan abjad. Hasil yang keluar bisa berupa angka latin, romawi, maupun abjad tergantung type yang kita masukkan. Adapun format yang digunakan adalah sebagai berikut :
Untuk membuat tipe yang berbeda, kalian hanya perlu memasukkan atribut “type” didalam tag <ol>. Contoh :
2. Unordered List
Berbeda dengan sebelumnya, Unordered List atau Daftar tidak berurutan menggunakan tag <ul> dan <li>. Hasil atau Output yang dikeluarkan pun berupa simbol atau bentuk sebagai urutannya. Bentuk bisa berupa bulat atau kotak tergantung tipe yang kita masukkan. Format yang dimasukkan tidak jauh berbeda dengan sebelumnya hanya beda penggunaan tag saja. Contoh:
Sama seperti sebelumnya, jika kalian ingin membuat tipe yang berbeda, kalian hanya perlu memasukkan atribut “type” didalam tag.
3. Description
Nah, untuk yang satu ini memiliki format penulisan yang sedikit berbeda. Mulai dari tag yang digunakan sampai dengan cara penulisannya. Tag yang digunakan berupa <dl> untuk memulai, <dt>untuk objek yang akan dideskripsikan dan <dd> untuk deskripsi objek. Sesuai dengan namanya, jenis ini digunakan untuk mendeskripsikan suatu objek. Berikut ini contohnya :
Sebenarnya masih ada satu jenis lagi nih, namanya Nested List. Bahasa mudahnya, Tipe ini digunakan untuk menggabungkan jenis-jenis diatas. Mau tau contohnya? Ini dia :
Waduh formatnya gimana tuh kira-kira? Tulis di kolom komentar ya! Sampai jumpa di artikel selanjutnya!