Sebuah dafatr dapat memiliki penomoran atau hanya sebuah simbol berupa lingkaran atau bentuk lainnya. Dalam HTML, daftar yang menggunakan penomoran disebut dengan ordered list dan yang menggunakan simbol disebut dengan unorderd list.
Orderden List
Ordered list atau daftar berurutan dapat dibuat dengan menggunakan tag <ol> (singakatan dari ordered list) dan untuk setiap listnya kita gunakan tag <li> (singkatan dari list item/item daftar). Sebagai contoh, perhatikan kode HTML berikut :
Penomoran daftar akan dilakukan secara otomatis ketika anda menambahkan daftar item.
Catatan : Gunakan ordered list, ketika list/daftar memerlukan urutan yang benar, seperti cara menyalakan motor dan lain sebagainya.
Dan jika ditampilkan pada browser, maka yang akan anda dapatkan adalah seperti berikut :
Unordered List
Berbeda dengan daftar berurut, unordered list akan menandai setiap item dengan simbol. baik berupa lingkaran atau persegi (anda masih bisa merubahnya dengan CSS). Untuk membuat daftar tidak berurut kita gunakan tag <ul> dan seperti tag <ol>, item yang terdapat di dalamnya harus diapit dengan tag <li>.
Jika kita modifikasi contoh sebelumnya denga merubah <ol> menjadi <ul> maka akan kita dapat adalah seperti berikut :
Secara default, item akan ditandai dengan lingkaran.
Definition List
Berbeda dengan Ordered List dan Unordered List yang memiliki struktur sama, Data list memiliki struktur tersendiri. Biasanya data list ini digunakan untuk membuat daftar istilah beserta defenisinya seperti halnya dalam kamus.
Tag dt (defenition term) digunakan untuk menampung istilah yang akan didefinisikan, dan tag dd digunakan untuk menuliskan definisi dari dt sebelumnya. Berikut contoh pengguna dari Definition List :
List/Daftar bersarang
Sebuah daftar bisa saja memiliki daftar lagi di dalam itemnya, atau biasa kita sebut dengan daftar/list bersarang (nessted list). Contohnya seperti pada latihan yang akan kita buat berikut.
Buat file baru dengan nama file latihan5.html lalu ketikkan kode HTML berikut
Dan berikut tampilan pada browser.
Yang perlu anda perhatikan adalah di mana anda meletakkan tag <ol> atau <li> jika anda ingin menempatkannya pada suatu item, yaitu sebelum penutup tag list item (</li>).
Daftar seperti ini biasa digunakan untuk pembuatan menu website, atau keperluan lainnya yang memang membutuhkan penomoran atau sesuatu yang memiliki poin-poin.
Demikianlah Pelajaran kita kali ini, selanjutnya kita akan belajar Memahami Tag Div (Division)
Untuk itu pantengin terus bog Hendry Muda
tutorial yang bagus gan.. sangat bermanfaat :)
BalasHapustrimakasih atas komentarnya :)
Hapus