Menambahkan daftar

HTML mendukung tiga jenis daftar. Jenis yang pertama adalah sebuah daftar bulletted, sering disebut unordered list. Ia menggunakan tag <ul> dan <li> misalnya

<ul> <li> list item pertama </li>
<li> list item kedua </li>
<li> list item ketiga </li></ul>

Catatan bahwa anda perlu mengakhiri daftar dengan </ul> tag penutup, tetapi bahwa tag </li> bersifat opsional dan dapat diabaikan

Jenis kedua daftar adalah daftar bernomor, yang sering disebut ordered list. Ia menggunakan <ol> dan <li> tag. Misalnya

<ol> <li> list item pertama </li>
<li> list item kedua </li>
<li> list item ketiga </li> </ol>

Seperti bulletted lists, anda selalu perlu mengakhiri daftar dengan </ol> tag penutup, tetapi akhir tag </li> adalah opsional dan dapat diabaikan.

Yang ketiga dan terakhir adalah semacam daftar daftar definisi. Hal ini memungkinkan Anda untuk membuat daftar istilah dan definisi mereka.
Daftar semacam ini diawali dengan sebuah tag <dl> dan diakhiri dengan </dl>

Tiap hal diawali dengan sebuah tag <dt> dan setiap definisi dimulai dengan sebuah <dd> Misalnya:

<dl><dt> istilah pertama </dt><dd> penjelasannya </dd>
<dt> istilah kedua </dt> <dd> penjelasannya </dd>
<dt> istilah ketiga </dt><dd>  penjelasannya </dd></dl>

Tag penutup </dt> dan </dd> adalah opsional dan dapat diabaikan.

Perhatikan bahwa daftar ini bisa saling disisipkan, satu dalam yang lain. Misalnya

<ol><li> list item pertama </li>
<li> list item kedua <ul> <li> nested item pertama </li>
<li> bersarang kedua item </li> </ul> </li>
<li> list item ketiga </li> </ol>

Anda juga dapat menggunakan judul paragraf dan lain-lain untuk daftar item lagi.

Diambil dari pelajaran di www.w3.org

del.icio.us Digg Facebook MySpace reddit StumbleUpon Twitter

3 Responses to “Menambahkan daftar”

  1. Sefty says:

    Website anda sangat membantu sy yg baru bljr html.
    Tlg contonya dperjelas lg dong? Biar tau Kode trsbut jd nya sprt apa?
    Mkc bgt ya…
    Lam knl buat yg pnya website…

  2. Shofnet says:

    Sefty, Senang berkenalan dengan anda, terimakasih sebelum dan sesudahnya. Yang tertulis warna hijau itu sudah sebagai contohnya. Kalo mau mencoba anda tinggal copas saja kode tersebut pada halaman html anda.

Leave a Reply

Smilies