Membuat daftar/list di HTML
Di HTML, kita dapat membuat daftar/list. Ada 2 jenis list: berurutan (ordered list) dan tidak berurutan (unordered list).
Ordered list akan menampilkan daftar dengan nomor. Tagnya adalah <ol>.
Unordered list akan menampilkan daftar dengan bulatan. Tagnya adalah <ul>.
Sedangkan listnya sendiri tagnya adalah <li>. Tag <li> dimasukkan di antara tag ordered atau unordered list.
Membuat ordered list
Sebagai contoh, kita akan membuat list warna pelangi. Kode HTMLnya:
<!DOCTYPE html> <html> <head> <title>Membuat ordered list</title> </head> <body> <h2>Warna pelangi</h2> <ol> <li>Merah</li> <li>Jingga</li> <li>Kuning</li> <li>Hijau</li> <li>Biru</li> <li>Nila</li> <li>Ungu</li> </ol> </body> </html>
Web browser akan menampilkan seperti berikut:
Secara otomatis, ordered list akan menampilkan nomor urutannya.
Kita lanjut ke unordered list.
Baca juga ya..
- 4 Trik Menggunakan Microsoft Word yang Belum Ente Tahu
- Tips Memilih Menu Sarapan yang Sehat dan Terhindar dari Kegemukan
- Cara Mudah Mengatasi Hardisk Eksternal yang Tidak Terbaca (Corrupted/Unreadble)
Baca juga ya..
- 4 Trik Menggunakan Microsoft Word yang Belum Ente Tahu
- Tips Memilih Menu Sarapan yang Sehat dan Terhindar dari Kegemukan
- Cara Mudah Mengatasi Hardisk Eksternal yang Tidak Terbaca (Corrupted/Unreadble)
Membuat unordered list
Kita pakai contoh yang di atas saja, hanya ganti tag <ol> menjadi tag <ul> agar terlihat jelas perbedaannya.
Berikut kodenya:
<!DOCTYPE html> <html> <head> <title>Membuat unordered list</title> </head> <body> <h2>Warna pelangi</h2> <ul> <li>Merah</li> <li>Jingga</li> <li>Kuning</li> <li>Hijau</li> <li>Biru</li> <li>Nila</li> <li>Ungu</li> </ul> </body> </html>
Web browser akan menampilkan:
Unordered list akan menampilkan list dengan bulatan. Terlihat perbedaannya kan?
Kegunaan lain dari list HTML
Selain membuat list, tag list juga bisa digunakan untuk membuat navigasi halaman web, tetapi harus dibantu dengan CSS.
Kita juga bisa menempatkan list di dalam list. Bahasa jawanya itu nested list, list beranak atau list bersarang.
Sampai sini selesai pembahasan kita tentang pembuatan list di HTML.
Selanjutnya yang akan kita bahas yakni cara membuat link di HTML.
Tidak ada komentar:
Posting Komentar
Silakan berkomentar dengan kalimat yang bijak.