Menampilkan Daftar suatu
- ×
mikropon
Desainer web - ×
Jill
Mendukung - ×
Jane
Akuntan
Daftar dasar
- Jill
- Malam
- Adam
Daftar berbatasan
- Jill
- Malam
- Adam
Daftar Tajuk
nama
- Jill
- Malam
- Adam
Contoh
<ul class="w3-ul w3-border">
<li><h2>Names</h2></li>
<li>Jill</li>
<li>Eve</li>
<li>Adam</li>
</ul>
Cobalah sendiri " Daftar sebagai Kartu
- Jill
- Malam
- Adam
Daftar berpusat
- Jill
- Malam
- Adam
berwarna Daftar
- Jill
- Malam
- Adam
Berwarna Daftar Barang
- Jill
- Malam
- Adam
Contoh
<ul class="w3-ul">
<li class="w3-blue">Jill</li>
<li>Eve</li>
<li>Adam</li>
</ul>
Cobalah sendiri " daftar Hoverable
Kelas w3-hoverable menambahkan warna latar belakang abu-abu untuk setiap item daftar pada mouse-over:
- Jill
- Malam
- Adam
Contoh
<ul class="w3-ul w3-hoverable">
<li>Jill</li>
<li>Eve</li>
<li>Adam</li>
</ul>
Cobalah sendiri " Jika Anda ingin warna melayang-layang tertentu, menambahkan salah satu dari w3-melayang-kelas untuk masing-masing <li> elemen:
- Jill
- Malam
- Adam
daftar closable
Klik pada huruf "x" untuk menutup / menyembunyikan daftar item:
- Jill x
- Adam x
- Eve x
Contoh
<li>Jill
<span onclick="this.parentElement.style.display='none'"
class="w3-closebtn w3-margin-right w3-medium">x</span>
</li>
Cobalah sendiri " Daftar empuk
- Jill
- Malam
- Adam
- Jill
- Malam
- Adam
Contoh
<ul class="w3-ul">
<li class="w3-padding-hor-16">Jill</li>
<li
class="w3-padding-hor-16">Eve</li>
<li class="w3-padding-hor-16">Adam</li>
</ul>
Cobalah sendiri " Daftar Avatar
- x mikropon
Desainer web - x Jill
Mendukung - x Jane
Akuntan
Contoh
<ul class="w3-ul w3-card-4">
<li class="w3-padding-hor-16">
<span onclick="this.parentElement.style.display='none'"
class="w3-closebtn w3-padding">x</span>
<img src="img_avatar2.png"
class="w3-left w3-circle" style="width:60px">
<span
class="w3-xlarge">Mike</span><br>
<span>Web
Designer</span>
</li>
</ul>
Cobalah sendiri " Daftar kecil
- Jill
- Malam
- Adam
Daftar kecil
- Jill
- Malam
- Adam
Daftar besar
- Jill
- Malam
- Adam
XLarge Daftar
- Jill
- Malam
- Adam
XXLarge Daftar
- Jill
- Malam
- Adam
Contoh
<ul class="w3-ul w3-xxlarge">
<li>Jill</li>
<li>Eve</li>
<li>Adam</li>
</ul>
Cobalah sendiri " XXXLarge Daftar
- Jill
- Malam
- Adam
Contoh
<ul class="w3-ul w3-xxxlarge">
<li>Jill</li>
<li>Eve</li>
<li>Adam</li>
</ul>
Cobalah sendiri " Daftar jumbo
- Jill
- Malam
- Adam