Cara Membuat Daftar/List Pada HTML

Kali ini saya akan mememberikan tutorial Cara Membuat Daftar/List Pada HTML, ok langsung saja kita simak

Dalam HTML, tag list terdiri dari 2 jenis, ordered list (berurutan) dan unordered list (tidak berurutan)

Ordered list akan ditampilkan dengan angka atau huruf, sedangkan unordered list dengan bulatan atau kotak.

Ordered list menggunakan tag <ol>, dan unordered list menggunakan tag <ul>, sedangkan untuk list sendiri menggunakan tag <li>

Contoh penggunaan tag ordered list <ol>:

<!DOCTYPE html> <html> <head> <title>penggunaan tag list </title> </head> <body> <h1> daftar belanjaan</h1> <ol> <li>Minyak </li> <li>Sabun </li> <li>deterjen</li> <li>shampoo</li> <li>obat</li> </ol> </body> </html>

dan hasilnya :

Untuk menjadi unordered list, tinggal ganti tag <ol> menjadi <ul>.
Contoh penggunaan tag unordered list <ul>:

<!DOCTYPE html> <html> <head> <title>penggunaan tag list </title> </head> <body> <h1> daftar belanjaan</h1> <ul> <li>Minyak </li> <li>Sabun </li> <li>deterjen</li> <li>shampoo</li> <li>obat</li> </ul> </body> </html>

dan hasilnya :

Langkah terakhir adalah menyimpannya dan ingat simpan dengan nama .html
Penggunaan tag list pada HTML tidak hanya untuk membuat daftar saja. Dengan CSS, tag list dapat digunakan untuk membuat menu navigasi di dalam halaman web, seperti menu home, dan daftar link pada sidebar halaman ini. Tag list juga dapat digunakan untuk nested list, atau list bersarang, yang artinya sebuah list di dalam list lainnya.

Sekian postingan dari saya tentang Cara Membuat Daftar/List Pada HTML dan semoga bermanfaat.

Artikel Lainnya :

4 komentar

Balas

Unknown

21 April 2015 pukul 04.41

oke sama-sama

balmut

27 Mei 2016 pukul 07.57

kalo pointer yg custom gmn gan? Jadi bukan angka atau bulatan..

Ryan Zapple

2 Mei 2017 pukul 00.21

thanks ka aku jadi tau tentang Cara Membuat Daftar/List Pada HTML ka ini aku mau reccomend tentang HOSTEL MURAH DI BANDUNG COCOK UNTUK BACKPACKER aku reccomed banget nih buat yang bingung cari penginapan di daerah bandung

Miliana

21 Mei 2021 pukul 03.48

infonya mantap sekali kak

oriflame indonesia

Agung Eka's Blog

Cara Membuat Daftar/List Pada HTML

Artikel Lainnya :

4 komentar