Daftar HTML unordered
Daftar unordered dimulai dengan <ul> tag. Setiap item daftar dimulai dengan <li> tag.
Daftar item akan ditandai dengan peluru (lingkaran hitam kecil).
Daftar HTML unordered - The Style Atribut
Sebuah atribut style dapat ditambahkan ke daftar unordered, untuk menentukan gaya penanda:
list-style-type:disc : Daftar item akan ditandai dengan peluru (default ).
list-style-type:circle : Daftar item akan ditandai dengan lingkaran.
list-style-type:square : Daftar item akan ditandai dengan kotak.
list-style-type:none : Daftar item tidak akan ditandai
Contoh :
1. disc
<ul style="list-style-type:disc">
<li>aaaaa</li>
<li>bbbbb</li>
<li>ccccc</li>
</ul>
2. Circle
<ul style="list-style-type:circle">
<li>aaaa</li>
<li>bbbbb</li>
<li>ccccc</li>
</ul>
3. Square
<ul style="list-style-type:square">
<li>aaaa</li>
<li>bbbbb</li>
<li>ccccc</li>
</ul>
4. None
<ul style="list-style-type:none">
<li>aaaa</li>
<li>bbbbb</li>
<li>ccccc</li>
</ul>
Daftar HTML Ordered
Daftar ordered dimulai dengan <ol> tag. Setiap item daftar dimulai dengan <li> tag.
Daftar item akan ditandai dengan angka.
<ol>
<li>aaaa</li>
<li>bbbb</li>
<li>cccc</li>
</ol>
Daftar HTML Ordered - Tipe Atribut
Jenis atribut dapat ditambahkan ke daftar dengan nomor, untuk menentukan jenis penanda:
type="1" : Daftar item akan diberi nomor dengan angka (default )
type="A" : Daftar item akan diberi nomor dengan huruf besar
type="a" : Daftar item akan diberi nomor dengan huruf kecil
type="I" : Daftar item akan diberi nomor dengan angka romawi huruf besar
type="i" : Daftar item akan diberi nomor dengan angka romawi huruf kecil
Contoh :
1. Nomor.
<ol type="1">
<li>aaaa</li>
<li>bbbb</li>
<li>cccc</li>
</ol>
2. Huruf Besar
<ol type="A">
<li>aaaa</li>
<li>bbbb</li>
<li>cccc</li>
</ol>
3. Huruf Kecil
<ol type="a">
<li>aaaa</li>
<li>bbbb</li>
<li>cccc</li>
</ol>
4. Romawi Besar
<ol type="I">
<li>aaaa</li>
<li>bbbb</li>
<li>cccc</li>
</ol>
5. Romawi Kecil
<ol type="i">
<li>aaaa</li>
<li>bbbb</li>
<li>cccc</li>
</ol>
Deskripsi HTML
Daftar deskripsi, adalah daftar istilah, dengan deskripsi dari setiap istilah.
The <dl> mendefinisikan daftar deskripsi.
The <dt> mendefinisikan istilah (nama), dan <dd> tag mendefinisikan data (deskripsi).
<dl>
<dt>Buah</dt>
<dd>-Mangga /dd>
<dd>-Apel</dd>
<dd>-dll</dd>
<dt>sayuran</dt>
<dd>-wortel</dd>
<dd>-Gobez</dd>
</dl>
Daftar HTML bersarang
Daftar dapat bersarang (daftar dalam daftar).
<ul>
<li>Teh</li>
<li>Kopi
<ul>
<li>Kopi Manis</li>
<li>Kopi Pahit</li>
</ul>
</li>
<li>Susu</li>
</ul>
Daftar horisontal
Daftar HTML bisa ditata dalam berbagai cara dengan CSS.
Salah satu cara yang populer, adalah gaya daftar untuk menampilkan horizontal:
Dengan gaya ekstra, Anda dapat membuatnya terlihat seperti menu:
Bab Ringkasan
- Gunakan HTML <ul> elemen untuk mendefinisikan daftar unordered
- Gunakan atribut Style HTML untuk menentukan gaya peluru
- Gunakan HTML <ol> elemen untuk mendefinisikan daftar memerintahkan
- Gunakan type HTML atribut untuk menentukan jenis penomoran
- Gunakan HTML <li> elemen untuk menentukan item daftar
- Gunakan HTML <dl> elemen untuk mendefinisikan daftar deskripsi
- Gunakan HTML <dt> elemen untuk mendefinisikan istilah deskripsi
- Gunakan HTML <dd> elemen untuk mendefinisikan data deskripsi
- Daftar dapat bersarang di dalam daftar
- Daftar item dapat berisi elemen HTML lainnya
- Menggunakan display properti CSS: inline untuk menampilkan daftar horizontal
0 komentar:
Posting Komentar