KeyzeX – List merupakan bentuk yang umum yang biasa kita gunakan untuk menguraikan daftar, misalnya jenis-jenis list dalam HTML :
- List Dengan Nomor
- List Tanpa Nomor
List Definisi
List dengan nomor adalah model daftar yang setiap itemnya diberi nomor. Pada contoh kalimat di atas merupakan contoh list dengan nomor, walau hanya 1 daftar. Selain list bernomor dan tanpa nomor, ada sebuah list lagi yang bisa digunakan untuk membuat list yang memberi uraian terhadap suatu item dalam daftar, disebut sebagai list definisi. Untuk membuat list tanpa nomor atau biasa di sebut dengan bulleted list adalah sebagai berikut :
BULLETED LIST
- Mulai dengan tag pembuka list <ul>
- Masukan setiap item list dengan menggunakan tag <li> lalu tuliskan teks atau daftar yang ingin agan berikan pada setiap list, tag penutup list </li>, namun ini tidak usah di tuliskan tetapi agar lebih baik sebaiknya di tuliskan saja.
- Ulangi langkah kedua menuliskan item list berikutnya.
- Jika agan sudah selesai, maka tutuplah dengan menggunakan tag penutup list </ul>.
- Disk, berbentuk noktah tetapi tidak diasir tengahnya.
- Box, bentuk kotak.
ORDERED LIST
Untuk list dengan nomor, disebut juga ordered list. Tag pembuka list <ul> diubah menjadi <ol>, demikian juga tag penutup list </ul> diganti dengan tag penutup list </ol>.
Unuk membuat Ordered List adalah sebagai berikut :
Selain atribut type, ada juga atribut start, digunakan untuk mendefinisikan nomor awal yang akan digunakan pada ordered list. Jika ingin list dimulai dari nomor 8, makan berikut adalah contoh penggunakannya <ol start=8> Isikan teksnya </ol>
<html>
<body>
<h1> Ordered List:</h1>
<ol>
<li> Skateboard </li>
<li> Gaming Gear </li>
<li> PC Spek Dewo </li>
</ol>
<h1> Unordered List:</h1>
<ul>
<li> Skateboard </li>
<li> Gaming Gear </li>
<li> PC Spek Dewo </li>
</ul>
</body>
</html>
CONTOH NESTED LIST
<html>
<body>
<h1> Nested List:</h1>
<ul>
<li>Skateboard </li>
<li>Gaming Gear</li>
<ul>
<li>Hengset Dewo </li>
<li> Mouse Dewo </li>
<li> Keyboard Dewo </li>
</ul>
<li> PC Spek Dewo </li>
</ul>
</body>
</html>