Belajar HTML Part 9 : Membuat List Pada HTML

Membuat List Pada HTML
list atau yang kita kenal dengan daftar berurutan merupakan fungsi dalam HTML yang digunakan untuk menampilkan data secara berurutan ke bawah. Dalam HTML penilisan list menggunakan tag <li>. dalam membuat list pada HTML ini terdapat dua jenis tampilan list yang bisa di gunakan yaitu ordered list dan unordered list.
- ordered list berfungsi untuk menampilkan daftar list dalam bentuk huruf atau angka. tag yang digunakan dalam ordered list ini yaitu <ol>
- unordered list berfungsi untuk menampilkan daftar list dalam bentuk bulatan atau kotak di awalnya. tag yang diguanakan untuk membuat unordered list yaitu <ul>
untuk lebih mudahnya, perhatikan contoh penulisan list dalam HTML
1 2 3 4 5 6 7 8 9 10 |
<!DOCTYPE html> <html> <head> <title>belajar membuat list</title> </head> <body> <li>belajar HTML</li> <li>belajar PHP</li> </body> </html> |

Membuat List Pada HTML
contoh di atas menggunakan <li> untuk membuat list pada HTML. dapat anda lihat sendiri bahwa tampilan standar dari list pada HTML di awali dengan tanda titik.
Ordered List <ol>
menampilkan daftar list dan diawali dengan huruf atau angka, berikut contoh untuk implementasi ordered list pada HTML
1 2 3 4 5 6 7 8 9 10 11 12 |
<!DOCTYPE html> <html> <head> <title>belajar membuat list</title> </head> <body> <ol> <li>belajar HTML</li> <li>belajar PHP</li> </ol> </body> </html> |

ordered
unordered list <ul>
berikut contoh unordered list pada HTML :
1 2 3 4 5 6 7 8 9 10 11 12 |
<!DOCTYPE html> <html> <head> <title>belajar membuat list</title> </head> <body> <ul> <li>belajar HTML</li> <li>belajar PHP</li> </ul> </body> </html> |

Membuat List Pada HTML
dari contoh di atas bisa anda lihat perbedaan masing-masing penggunaan jenis list pada HTML.
penggunaan list pada HTML tidak hanya untuk membuat daftar saja. dengan menggabungkan CSS, JavaScript tag list ini bisa di gunakan untuk membuat menu navigasi pada halaman web. selain itu <list> dapat digunakan untuk memlist bersarang (list yang berdasarkan dalam list yang lain).
Tutorial HTML Dasar Lainnya
Belajar HTML Part 1 : Pengertian HTML
Belajar HTML Part 2 : Memilih Text Editor
Belajar HTML Part 3 : Mengenal Tag, Element, Atribut HTML
Belajar HTML Part 4 : Heading Pada HTML
Belajar HTML Part 5 : Format Text Pada HTML
Belajar HTML Part 6 : Membuat Paragraf Pada HTML
Belajar HTML Part 7 : Membuat Table Pada HTML
Belajar HTML Part 8 : Membuat Hyperlink Pada HTML
Belajar HTML Part 9 : Membuat List Pada HTML
Belajar HTML Part 10 : Membuat Format Code Pada HTML
Belajar HTML Part 11 : Membuat Form Pada HTML
Belajar HTML Part 12 : Atribut Form Pada HTML
Belajar HTML Part 13 : Membuat Symbol Pada HTML
Belajar HTML Part 14 :Menampilkan Gambar Pada HTML
Belajar HTML Part 15 : Tag Iframe Pada HTML
Tutorial Menarik Lainnya

Membuat Navbar Responsive dengan HTML dan CSS


Contoh Coding HTML Website Biodata, Dan Cara Membuatnya


Membuat Show Hide Password Di HTML

