Tag HTML <ul>
Contoh
Daftar HTML yang tidak berurutan:
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
Lebih banyak contoh "Coba Sendiri" di bawah ini.
Definisi dan Penggunaan
Tag <ul>
mendefinisikan daftar yang tidak berurutan (berpoin).
Gunakan <ul>
tag bersama dengan tag <li> untuk membuat daftar yang tidak berurutan.
Tip: Gunakan CSS untuk menata daftar .
Tip: Untuk daftar terurut, gunakan tag <ol> .
Dukungan Peramban
Element | |||||
---|---|---|---|---|---|
<ul> | Yes | Yes | Yes | Yes | Yes |
Atribut Global
Tag <ul>
juga mendukung Atribut Global dalam HTML .
Atribut Acara
Tag <ul>
juga mendukung Atribut Peristiwa dalam HTML .
Lebih Banyak Contoh
Contoh
Setel berbagai jenis gaya daftar (dengan CSS):
<ul style="list-style-type:circle">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
<ul style="list-style-type:disc">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
<ul style="list-style-type:square">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
Contoh
Perluas dan kurangi tinggi baris dalam daftar (dengan CSS):
<ul style="line-height:180%">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
<ul
style="line-height:80%">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
Contoh
Buat daftar di dalam daftar (daftar bersarang):
<ul>
<li>Coffee</li>
<li>Tea
<ul>
<li>Black tea</li>
<li>Green tea</li>
</ul>
</li>
<li>Milk</li>
</ul>
Contoh
Buat daftar bersarang yang lebih kompleks:
<ul>
<li>Coffee</li>
<li>Tea
<ul>
<li>Black tea</li>
<li>Green tea
<ul>
<li>China</li>
<li>Africa</li>
</ul>
</li>
</ul>
</li>
<li>Milk</li>
</ul>
Halaman Terkait
Tutorial HTML: Daftar HTML
Referensi DOM HTML: Objek Ul
Tutorial CSS: Daftar Gaya
Pengaturan CSS Default
Sebagian besar browser akan menampilkan <ul>
elemen dengan nilai default berikut:
Contoh
ul {
display: block;
list-style-type: disc;
margin-top: 1em;
margin-bottom: 1 em;
margin-left: 0;
margin-right: 0;
padding-left: 40px;
}