Belajar Cara Membuat List di HTML

Pada artikel ini saya akan menjelaskan bagaimana cara membuat list di HTML. List adalah salah satu bagian paling penting dan sebelum membuatnya, ada baiknya kita berkenalan terlebih dahulu mengenai apa itu List.

List adalah salah satu fungsi yang digunakan untuk menampilkan data berurutan kebawah yang biasanya digunakan untuk mengelompokan data berdasarkan jenisnya atau berdasarkan prosesnya.

List menunjukan suatu proses berurutan dari langkah pertama sampai langkah terakhir, seperti langkah-langkah dari suatu pekerjaan tertentu.

Ada juga list yang ditunjukan untuk membuat suatu daftar yang tidak memerlukan pengurrutan, misalkan membuat daftar makanan dan minuman.

Untuk mendapatkan gambaran dari penjelasan diatas, berikut adalah contoh penggunaan list.

Cara Membuat List di HTML

Setelah memahami pengertian, cara kerja dan contohnya. Berikut adalah cara membuat list di HTML.

Baca Juga: Belajar Cara Membuat Form di HTML

Cara Membuat List di HTML

Untuk membuat list di HTML, tag yang digunakan adalah <li>. List sendiri memiliki beberapa jenis, diantaranya yaitu:

  1. Ordered Listdigunakan untuk membuat daftar list dalam bentuk huruf atau angka.
  2. Unordered List digunakan untuk membuat daftar list dalam bentuk kotak atau bulatan.
  3. Description List digunakan untuk membuat daftar deskripsi atau penjelasan.

Membuat Ordered List

Tag yang digunakan untuk membuat Ordered List adalah tag <ol>, bentuk daftar list yang ditampilkan adalah huruf atau angka.

Ordered List

Membuat Unordered List

Tag yang digunakan untuk membuat Unordered List adalah tag <ul>, bentuk daftar list yang ditampilkan adalah kotak atau bulatan.

Unordered List

Membuat Description List

Tag yang digunakan untuk membuat Description List adalah tag <dl>, Hampir sama dengan Ordered List dan Unordered List. Bentuk daftar list yang ditampilkan adalah penjelasan mengenai suatu pernyataan.


Description List

  1. Tag <dl> berfungsi untuk mendefinisikan sebuah Description List
  2. Tag <dt> berfungsi untuk mendefinisikan term (nama)
  3. Tag <dd> berfungsi untuk mendefinisikan data (deskripsi)

Sampai sini kamu sudah berhasil membuat List di HTML, akan tetapi kamu masih bisa membuat list lebih spesifik menggunakan tambahan atribut. Khususnya untuk Ordered List, kamu bisa membuatnya lebih spesifik seperti memperhatikan bentuk tampilan listnya.

Untuk lebih jelasnya, berikut adalah beberapa contohnya.

Membuat List Dengan Awalan Angka 1

Membuat List Dengan Awalan Huruf “A”

Membuat List Dengan Awalan Huruf “a”

Membuat List Dengan Awalan Huruf “I”

Membuat List Dengan Awalan Huruf “i”

Kesimpulan

Penggunaan list di HTML tergantung situasi atau kebutuhan kamu sebagai pengguna, karena list dalam HTML digunakan hanya untuk pengurutan suatu pernyataan. Seperti membuat jadwal kegiatan, resep makanan, langkah-langkah melakukan membuat sesuatu dan lain sebagainya. 

Leave a Reply