Mengenal HTML Bagian 7 : Pembuatan List Dalam HTML

Dalam pembuatan WebSite, list (daftar) merupakan suatu yang dianggap penting. Daftar mengenai berbagai hal selalu dapat ditemukan dalam penulisan dokumen. Mulai dari resep kurus denganlist list yang harus di penuhi ataulist mantan yang sudah pernah singgah di hati ini hehe banyak sekali kegunaannya. Daftar utama dalam HTML sendiri memiliki 3 element khusus, seperti dibawah ini.

Unordered List (Daftar Tidak Terurut) atau <ul>

- Seperti nama nya, Ini memungkinkan untuk membuat daftar dari hal-hal yang tidak memiliki urutan tertentu.

Ordered List (Daftar Terurut) atau <ol>

- Ini memungkinkan untuk memberikan kita fasilitas untuk membuat daftar hal-hal yang harus diurutkan dengan benar.

Pemilihan list yang akan digunakan sendiri tentunya tergantung kepada konten yang akan ditulis, serta makna semantik yang diinginkan. Berikut adalah penjelasannya.

Unordered List

digunakan untuk memberikan daftar dari hal-hal yang tidak memiliki urutan tertentu, atau yang urutannya tidak penting. Pembuatan unordered list dilakukan dengan menggunakan elemen <ul> (unordered list), yang merupakan sebuah block level element. Untuk mengisikan daftar, kita dapat menggunakan elemen <li> (list item), seperti pada kode di bawah ini.



Dan hasilnya seperti dibawah ini.

Nah kalian bisa melihta hasil diatas terdapat titik hitam, itulah fungsi dari elemen <li> tadi, nah elemen ini bisa di ubah benyuknya, seperti contoh dibawah ini.



Dan hasilnya seperti dibawah ini.

Diatas terlihat ada perbedaan di bentuk list nya, itu karena di ubah CSS nya di bagian elemen <li> nya.

Ordered List

Elemen untuk pembuatan ordered list yaitu <ol> (ordered list), dan isi dari list sendiri dibuat dengan menggunakan elemen <li>, sama seperti pada unordered list. Secara standar ordered list akan menggunakan angka sebagai penanda daftar, berikut contoh nya.



Dan hasilnya seperti dibawah ini.

nah diatas terliat elemen list nya berubah menjadi anggka, tentunya angka ini dapat start dimulai sesuai yang kalian ingin kan dengan ditambhkan properti seperti dibawah ini.

Sebenarnya da lagi satu yang saya pikir cukup menarik, yakni Nested List. Elemen ini mampu membuat list didalam list, jadi kaya gini nih dibawah ini.



Dan hasilnya seperti dibawha ini.

Nah seperti itulah materi list di HTML, mohon maaf kalo ada kesalahan sebetulnya saya juga masih amatir dan belum banyak mengerti tentang HTML, saya hanya membagikan pengalaman belajar saya saja hehe. Terima kasih sudah berkunjung, jika berkenan silakan follow hahaha.