Element Ordered List HTML


Element "ordered list" (daftar berurutan) yang biasa menggunakan tag <ol> pada dokumen html merupakan suatu cara untuk membuat suatu daftar yang memiliki urutan tertentu yang biasanya ditandai dengan angka ataupun huruf di depannya.

Tag <ol> atau element ordered list ini harus memiliki tag penutup </ol>, selain itu Element ini juga memiliki beberapa attribute yang bisa digunakan untuk menentukan gaya penomoran seperti attribute "type". Atribut ini akan menentukan gaya penomoran dengan menggunakan angka, huruf besar, huruf kecil, angka Romawi besar ataupun angka Romawi kecil. Seperti :

<ol type="A">
  <li>Poin pertama</li>
  <li>Poin kedua</li>
</ol>

Selain itu Element ini juga memiliki attribute "start" untuk menentukan gaya penomoran dengan menentukan angka awal dari daftar penomoran seperti: 

<ol start="5">
  <li>Langkah kelima</li>
  <li>Langkah keenam</li>
</ol>

Dari contoh di atas maka penomoran daftar yang ditampilkan akan dimulai dari nomer 5. Selan itu juga attribute "reversed" yang akan membuat daftar yang ditampilkan dengan urutan yang terbalik. Seperti : 

<ol reversed>
  <li>Langkah 3</li>
  <li>Langkah 2</li>
  <li>Langkah 1</li>
</ol>

Cobalah paste kan kode berikut ini kedalam editor teks yang ada dibawah untuk melihat hasil dari tampilan element <ol> yang dikombinasikan dengan element <ul> yang memiliki atribute-atribute yang telah disebutkan sebelumnya.

<h2>Cara Membuat Kopi</h2>

<ol>
  <li>Siapkan bahan dan alat:
    <ul>
      <li>Biji kopi</li>
      <li>Air panas</li>
      <li>Cangkir</li>
      <li>Saringan kopi</li>
    </ul>
  </li>

  <li>Langkah-langkah pembuatan:
    <ol type="a">
      <li>Giling biji kopi hingga halus</li>
      <li>Panaskan air hingga hampir mendidih</li>
      <li>Masukkan bubuk kopi ke saringan</li>
      <li>Tuangkan air panas secara perlahan</li>
    </ol>
  </li>

  <li>Nikmati kopi hangatmu </li>
</ol>

 

Subscribe to receive free email updates:

0 Response to "Element Ordered List HTML"

Post a Comment