MODUL 4 BEKERJA DENGAN LIST

Pada modul ini, Praktikan akan mengetahui dan memahami tentang fungsi dan cara menggunakan fitur LIST pada HTML.

LIST merupakan salah satu fitur HTML dalam membuat daftar yang berurutan atau

tidak.

4.1 Daftar Berurutan (Order List)

Daftar  berurutan  adalah  suatu  metoda  untuk  menguraikan  suatu  topik  berdasarkan

urutan tertentu, dapat berupa :

  1. Angka (1,2,3, dst).
  • Abjad besar atau kecil (A, B, C, dst atau a, b, c, dst)
  • Angka Rowawi besar atau kecil (I,II,II, dst atau i,ii,iii, dst) Contoh :
Matakuliah favorit saya : Matakuliah favorit saya :
1. Web Desain A.  Web Desain
2. Web Programming B.  Web Programming
3. Basis Data C.  Basis Data

Untuk membuat order list di awali dengan tag <ol> list </ol>, sedangkan untuk listnya diberikan tag <li>list item</li>

4.2 Daftar Tidak Berurutan (Unorder List)

Dengan  metoda  ini,   urutan-urutan   dari  sebuah   topik  diatur  dengan   menggunakan

simbol.

Contoh :

Matakuliah favorit saya : Matakuliah favorit saya :
§ Web Desain · Web Desain
§ Web Programming · Web Programming
§ Basis Data · Basis Data

Untuk membuat Unorder list di awali dengan tag <ul> list </ul>, sedangkan untuk listnya diberikan tag <li>list item</li>.

PRAKTIKUM

Untuk lebih memperdalam pemahaman Anda, silahkan coba latihan berikut dan ambil kesimpulan :

Order List

  • Latihan 1 :

<ol>

<li>Coffee</li>

<li>Milk</li>

</ol>

  • Latihan 2 :

<ol type=”1″> <li>Coffee</li> <li>Tea <li>Milk</li>

</ol>

Silahkan Anda ganti nilai type dengan A, a, I dan i untuk menentukan jenis

urutannya.

  1. List ditampilkan dalam bentuk urutan angka (nilai default)

AList ditampilkan dalam bentuk urutan Abjad Besar

aList ditampilkan dalam bentuk urutan abjad kecil

IList ditampilkan dalam bentuk urutan angka romawi besar

iList ditampilkan dalam bentuk urutan angka romawi kecil

Anda  juga   dapat  menentukan   nilai   awal   dalam   daftar  urutannya   dengan

menambahkan atribut start. Kerjakan latihan berikut :

  • Latihan 3 :

<ol type=”1″ start=5> <li>Coffee</li> <li>Tea <li>Milk</li>

</ol>

Maka daftar urutannya akan dimulai dari angka lima.

Un-Order List

  • Latihan 4

<ul>

<li>Coffee</li>

<li>Tea</li>

<li>Milk</li>

</ul>

  • Latihan 5
  • Latihan 6
  • Latihan 7
  • Latihan 8

Selamat belajar,

REFERENSI LANJUTAN :

  1. http://www.w3schools.com/html/html_lists.asp
  2. http://www.echoecho.com/htmllists01.htm