Langkah berikutnya yang akan kita pelajari adalah cara membuat daftar/list di HTML. Untuk menampilkan sebuah text sebagai daftar/list, HTML menyediakan Tag List.
Ada 3 jenis list dalam dokumen html yaitu:
1. Ordered List <ol>
Tag <ol> adalah kependekan dari Ordered List, yang artinya list secara berurutan. list yang ditampilkan nanti oleh tag ini akan menampilkan nomor disebelah kiri dari detail.
<!DOCTYPE html>
<html>
<head>
<title>web saya</title>
</head>
<body>
TUGAS HARI INI ADALAH :
<ol>
<li>Memasak</li>
<li>cuci piring</li>
<li>cuci baju</li>
<li>mandi</li>
<li>sarapan</li>
<li>berangkat sekolah</li>
</ol>
</body>
</html>
Priview
TUGAS HARI INI ADALAH :
- Memasak
- cuci piring
- cuci baju
- mandi
- sarapan
- berangkat sekolah
Pada Ordered List“<ol> secara default pengurutan akan diurutkan dengan angka. Jika anda ingin mengurutkan dengan huruf/romawi maka anda tinggal menambahkan atribut type pada tag <ol> contoh:
Baca Juga
- Kumpulan Video dan Source Tutorial Master PHP Pemula Full Complit Gratis
- Kumpulan Tutorial Developers 2018 Full Gratis Download
- Menggunakan Library dan Helper di CodeIgniter
- CodeIgniter & Database
- Bagian 19. Membuat Halaman Website Minimalis
- Bagian 18. Lebih Dalam Bekerja dengan CSS
- Bagian 17. Struktur Penulisan Pada CSS
- Bagian 16. Cara Menggunakan CSS
- Bagian 15. Memulai Menggunakan CSS
- Tutorial Video The Complete Angular Course Beginner to Advanced Free Download
<!DOCTYPE html>
<html>
<head>
<title>web saya</title>
</head>
<body>
TUGAS HARI INI ADALAH :
<ol type="A">
<li>Memasak</li>
<li>cuci piring</li>
<li>cuci baju</li>
<li>mandi</li>
<li>sarapan</li>
<li>berangkat sekolah</li>
</ol>
</body>
</html>
Priview
TUGAS HARI INI ADALAH :
- Memasak
- cuci piring
- cuci baju
- mandi
- sarapan
- berangkat sekolah
Ketika script di atas di jalankan makan pengurutan list akan berubah, pengurutan akan diurutkan dengan huruf.
2. Unordered List <ul>
Unordered List merupakan pengurutan list dengan menggunakan symbol/bullet. Cara membuatnya sama dengan Ordered List hanya saja tag <ol> diganti dengan tag <ul>.
Contoh:
<!DOCTYPE html>
<html>
<head>
<title>web saya</title>
</head>
<body>
TUGAS HARI INI ADALAH :
<ul>
<li>Memasak</li>
<li>cuci piring</li>
<li>cuci baju</li>
<li>mandi</li>
<li>sarapan</li>
<li>berangkat sekolah</li>
</ul>
</body>
</html>
Priview
TUGAS HARI INI ADALAH :
- Memasak
- cuci piring
- cuci baju
- mandi
- sarapan
- berangkat sekolah
3. List tanpa bullet <dl>
Untuk membuat list tanpa mengunakan bullet/symbol caranya sama persis dengan pembuatan list dengan tag ol/ul, hanya saja tag <ul> diganti dengan <dl> lalu tag <li> diganti dengan <dd>
contoh:
<!DOCTYPE html>
<html>
<head>
<title>web saya</title>
</head>
<body>
TUGAS HARI INI ADALAH :
<dl type=>
<dd>Memasak</dd>
<dd>cuci piring</dd>
<dd>cuci baju</dd>
<dd>mandi</dd>
<dd>sarapan</dd>
<dd>berangkat sekolah</dd>
</dl>
</body>
</html>
Priview
TUGAS HARI INI ADALAH :
- Memasak
- cuci piring
- cuci baju
- mandi
- sarapan
- berangkat sekolah
Selamat mencoba..
Bagian 12. Membuat List Pada Halaman HTML
Reviewed by Akief Takaful
on
11:09 PM
Rating:
Reviewed by Akief Takaful
on
11:09 PM
Rating:
No comments: