> HTML LIST

Selasa, 15 Maret 2011

HTML LIST

List termasuk atribut yang sering digunakan dalam membuat sebuah daftar ataupun sub daftar. Biasanya bentuk list yang sering digunakan adalah seperti Angka, huruf, romawi, titik atau bentuk-bentuk bidang seperti lingkaran, kotak, dll.

Berikut beberapa contoh bentuk list yang sering digunakan :


<h4>List bentuk Angka :</h4>     
 <ol>
 <li>Satu</li>
 <li>Dua</li>
 <li>Tiga</li>
 <li>Empat</li>
</ol>

    List bentuk Angka :                

  1. Satu
  2. Dua
  3. Tiga
  4. Empat



<h4>List bentuk Huruf besar:</h4>
<ol type="A">
 <li>Huruf besar A</li>
 <li>Huruf besar B</li>
 <li>Huruf besar C</li>
 <li>Huruf besar D</li>
</ol>

List bentuk Huruf besar :        

  1. Huruf besar A
  2. Huruf besar B
  3. Huruf besar C
  4. Huruf besar D



<h4>List bentuk Huruf kecil:</h4>
<ol type="a">
 <li>Huruf kecil a</li>
 <li>Huruf kecil b</li>
 <li>Huruf kecil c</li>
 <li>Huruf kecil d</li>
</ol>

List bentuk Huruf kecil :           

  1. Huruf kecil a
  2. Huruf kecil b
  3. Huruf kecil c
  4. Huruf kecil d



<h4>List bentuk Romawi besar:</h4>
<ol type="I">
 <li>Romawi besar I</li>
 <li>Romawi besar II</li>
 <li>Romawi besar III</li>
 <li>Romawi besar IV</li>
</ol>

List bentuk Romawi besar :

  1. Romawi besar I
  2. Romawi besar II
  3. Romawi besar III
  4. Romawi besar IV



<h4>List bentuk Romawi kecil:</h4>
<ol type="i">
 <li>Romawi kecil i</li>
 <li>Romawi kecil ii</li>
 <li>Romawi kecil iii</li>
 <li>Romawi kecil iv</li>
</ol>

List bentuk Romawi kecil :   

  1. Romawi kecil i
  2. Romawi kecil ii
  3. Romawi kecil iii
  4. Romawi kecil iv



<h4>Disc bullets list:</h4>                
<ul type="disc">
 <li>Merah</li>
 <li>Kuning</li>
 <li>Hijau</li>
 <li>Biru</li>
</ul>

Disc bullets list :                   

  • Merah
  • Kuning
  • Hijau
  • Biru



<h4>Circle bullets list:</h4>              
<ul type="circle">
 <li>Merah</li>
 <li>Kuning</li>
 <li>Hijau</li>
 <li>Biru</li>
</ul>

Circle bullets list :                

  • Merah
  • Kuning
  • Hijau
  • Biru



<h4>Square bullets list:</h4>            
<ul type="square">
 <li>Merah</li>
 <li>Kuning</li>
 <li>Hijau</li>
 <li>Biru</li>
</ul>

Square bullets list :               

  • Merah
  • Kuning
  • Hijau
  • Biru



<h4>Sub Daftar:</h4>                      
<ul> <li>Buah</li>
  <li>Hewan
    <ul>
    <li>Reptil</li>
    <li>Mamalia
      <ul>
      <li>Sapi</li>
      <li>Kambing</li>
      </ul>
    </li>
    </ul>
  </li>
  <li>Pohon</li>
</ul>

Sub Daftar :                           

  • Buah
  • Hewan
    • Reptil
    • Mamalia
      • Sapi
      • Kambing
  • Pohon

OK....Selamat membaca artikel yang lain dan semoga bermanfaat....
Anda juga bisa berlangganan artikel-artikel terbaru dari saya, silahkan anda masukkan email pada forum Langganan Via Email yang ada disebelah kanan halaman ini.
Jangan lupa luangkan waktu untuk beri komentar ya......terima kasih.
Ping your blog, website, or RSS feed for Free

Related Articles :

Baca artikel lain :

Informasi Artikel :
Judul : "HTML LIST"
Diulas Oleh : | Selasa, 15 Maret 2011 | 08.53
Description : List termasuk atribut yang sering digunakan dalam membuat sebuah daftar ataupun sub daftar. Biasanya...

Posisi Rich Snippets : Rating: 3.4

Sampai saat ini baru ada : 3komentar

>>> Silahkan tambahkan komentar Anda...


3 komentar:

  1. wah tips yg sgt bermanfaat nih, thx ya sdh mau berbagi, salam kenal

    BalasHapus
  2. trims mas untuk postingannya. sangat bermanfaat u saya. namun saya pernah melihat list bentuknya spt dibawah ini:
    jenis warna:
    1). putih
    2). merah
    3). kuning
    4). dst.
    kalau pake html atau css bisa ngak mas? trims untuk bantuannya.

    BalasHapus
    Balasan
    1. HTML dan css untuk bentuk yg anda maksud, sy belum pernah lihat.
      maaf ya...

      Hapus

BLOGGER

TUTORIAL BLOGGER

TUTORIAL BLOGGER

REKOMENDASI

REKOMENDASI


Artikel Terbaru

POST POPULER

Entri Populer


MY BLOG

Daftar Blog Saya

  • Satu lagi pengembangan fitur slide show terbaru dari saya. Fitur ini saya beri nama "*Slide down random post*", sebab fitur ini saya adopsi dan saya kemba...
  • Rahasia Website Pemula *7 Rahasia Membuat Website Bagi Pemula* *Khusus buat orang-orang yang masih gaptek !!!* RWP dalam Pelatihan Nyata (Offline) *B...
  • Silahkan Anda bisa manfaatkan forum ini untuk berkomunikasi dengan kami :

BLOGGER

HTML

CSS

JAVASCRIPT


BACKLINK

INFO

Bagi anda yang berminat tukar link, silahkan copy linknya lalu pasang di Blog anda. Dan bila sudah terpasang, jangan lupa beritahu saya, agar link anda segera saya pasang di Blog tercinta ini.
Salam sukses selalu buat kita semua..... Amiiin.

CEO,
www.carabuatwebgratis.com
Noer cholis
Plosokuning V, Minomartani,
Ngaglik, Sleman, Yogyakarta.

TUKAR LINK

TUKAR LINK






Baca artikel "Manfaat Tukar Link"

CHAT

CHAT



TESTIMONI

Bila anda merasa artikel ataupun tutorial yang ada di Blog ini bermanfaat, anda bisa berikan suport comment melalui form ini. Form ini sangat bagus sebagai BACKLINK buat blog anda, silahkan tinggalkan link anda....

RECENT COMMENT

Recent Comments


top down