List digunakan untuk membuat daftar dalam bentuk text. List berisi beberapa text yang ditampilkan dalam bentuk daftar. List terdiri dari list tanpa penomoran dan list dengan penomoran.
List Tanpa Penomoran #
List tanpa penomoran menggunakan tag ul, sedangkan isi list dibuat dengan menggunakan tag li.
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul> Atribut style dapat digunakan untuk mengatur jenis marker yang ditampilkan pada list.
Marker Disk #
Marker disk adalah marker default list, marker ini berbentuk lingkaran berwarna hitam.
<ul style="list-style-type:disc;">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul> Marker Circle #
Marker circle berbentuk lingkaran tanpa warna.
<ul style="list-style-type:circle;">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul> Marker Square #
Marker square berbentuk kotak.
<ul style="list-style-type:square;">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul> Tanpa Marker #
List tanpa penomoran juga bisa ditampilkan tanpa marker.
<ul style="list-style-type:none;">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul> List Dengan Penomoran #
List dengan penomoran mempunyai marker berupa urutan angka atau huruf. List ini menggunakan tag ol, sedangkan isi list dibuat dengan menggunakan tag li.
<ol>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol> Terdapat beberapa tipe penomoran yang dapat diatur dengan menggunakan atribut type.
Penomoran Angka #
<ol type="1">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol> Ini adalah tipe penomoran default dari list dengan penomoran.
Penomoran Huruf Besar #
Penomoran ini memakai huruf besar dari A sampai Z.
<ol type="A">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol> Penomoran Huruf Kecil #
Penomoran ini memakai huruf kecil dari a sampai z.
<ol type="a">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol> Penomoran Angka Romawi Besar #
Penomoran ini memakai angka romawi mulai dari I, II, III dan seterusnya.
<ol type="I">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol> Penomoran Angka Romawi Kecil #
Penomoran ini memakai angka romawi mulai dari i, ii, iii dan seterusnya.
<ol type="i">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol> Atribut Start #
Atribut start dipakai untuk mengubah nomor awal list dengan penomoran.
<ol start="50">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol> List Di Dalam List #
List dapat berisi list yang lain.
<ol>
<li>Coffee</li>
<li>Tea
<ol>
<li>Black tea</li>
<li>Green tea</li>
</ol>
</li>
<li>Milk</li>
</ol> List dengan penomoran bisa berada di dalam list tanpa penomoran, begitu juga sebaliknya.
<ul>
<li>Coffee</li>
<li>Tea
<ol>
<li>Black tea</li>
<li>Green tea</li>
</ol>
</li>
<li>Milk</li>
</ul>
