List HTML
List HTML merupakan bentuk yang umum yang biasa kita gunakan untuk menguraikan daftar sesuatu, misalnya jenis-jenis list dalam HTML :
1. List dengan nomor
2. List tanpa nomor
3. List definisi
list dengan nomor dalah model daftar yang setiap itemnya diberi nomor. Pada contoh kalimat diatas merupakan contoh list dengan menggunakan nomor.
Selain list bernomor dan tanpa nomor, ada sebuah list lagi yang bisa digunakn untuk membuat list yang memberi uraian terhadap suatu item dalam daftar (disebut list definisi).
Untuk membuat list tanpa nomor, disebut juga bulleted list :
- Mulai dengan tag pembuka list <ul>
- Masukkan setiap item list dengan menggunakan tag <li> kemudian tuliskan itemnya (satu saja), tag penutup item </li>, sebenarnya ini tidak harus dituliskan (tetapi sebaiknya dituliskan).
- Ulangi lagi langkah kedua untuk menuliskan item list berikutnya.
- Akhiri seluruh list dengan sebuah tag penutup </ul>
Ubtuk list dengan nomor disebut juga dengan ordered list, tag <ul> diubah dengan <ol>, demikian juga </ul> diganti dengan </ol>.
Contoh list :
<html>
<body>
<h4>An Ordered List : </h4>
<ol>
<li>Martabak</li>
<li>Nasgor</li>
<li>Kupat Tahu</li>
</ol>
<h4>An Unordered List : </h4>
<ul>
<li>Martabak</li>
<li>Nasgor</li>
<li>Kupat Tahu</li>
</ul>
</body>
</html>
Ordered list
Nomor item secara default adalah menggunakan angka 1,2,3,....., dst sampai dengan sejumlah item dalam list tersebut.
Untuk keperluan penyajian tertentu kita dapat mengubah nomor dalam ordered list dengan model angka yang lain, dengan mengisi atribut (type) pada tag <ol>/
Berikut adalah nilai-nilai yang dapat digunakan untuk mengubah penomoran dalam ordered list;
| Type | Arti |
|---|---|
I |
Ditampilkan dengan angka romawi huruf besar |
i |
Ditampilkan dengan angka romawi huruf kecil |
a |
Diubah dengan menggunakan abjad huruf kecil |
A |
Diubah dengan menggunakan abjad huruf besar |
Selain atribut type, ada juga atribut start, digunakan untuk mendefinisikan nomor awal yang akan digunakan pada ordered list. Jika ingin supaya list dimulai dari nomor 7, maka berikut adalah contoh penggunaannya <ol start=7>....</ol>.
Unordered List
Unordered list sering disebut sevagai bulleted list, mempunyai bullet default berupa noktah. Jenis bullet bisa diubah, verikut adalah daftar jenis bullet yang bisa digunakan untuk mengubah bullet default pada bulleted list.
- Disk, bentuk noktah tetapi tidak diarsir di tengahnya.
- Box, bentuk kotak
Untuk mengubah jenis bullet dapat didefinisikan pada atribut type pada tag <ul>, berikut adalah contoh untuk mengubah jenis bullet menjadi kotak <ul type="box">.....</ul>.
Pada contoh kalimat diatas merupakan contoh list dengan menggunakan bullet list.
Nested List
Bullet dapat digunakan secara bersarang, maksudnya didalam list ada list lagi.
Contoh :
<html>
<body>
<h4>A Nested List :</h4>
<ul>
<li>Coffee</li>
<li>Tea</li>
<ul>
<li>Black tea</li>
<li>Green tea</li>
</ul>
<li>Milk</li>
</ul>
</body>
</html>
Definition List
Contoh inimendemontrasikan suatu definotion list:
<html>
<body>
<h4>A definition List : </h4>
<dl>
<dt>Coffee</dt>
<dd>Blact Tea</dd>
<dt>milk</dt>
<dd>Ice Cream</dd>
</dl>
</body>
</html>
0 komentar:
Posting Komentar