Membuat nomor urut list style menarik pada sidebar

Posted by webmaster on Dec 24, 2009 | 2 Comments

list styleMaaf sebelumnya kalau penulisan judul pada posting ini dirasakan kurang mengena dengan isinya. Karena jujur bahwa saya kebingungan ketika akan memilih judul untuk posting ini.

Sebagai seorang blogger kita secara tidak langsung dituntut untuk memiliki blog yang bagus, beda dari yang lain walaupun hal tersebut hanya berlaku bagi sebagian orang saja.

Dalam suatu blog tentu tidak lepas dari element sidebar. Dan dalam sidebar itu sendiri biasanya terdapat resent post, random artikel, atau juga resent comment. Nah pada menu tersebut biasanya ada yang diurut berdasarkan nomor urutnya, atau juga menggunakan titik saja, bahkan ada yang tidak ada list style sama sekali. Untuk lebih jelasnya lihat daftar berikut ini.

Urutan posting awal blog anawia.com

  1. Posting pertama bukan utama
  2. Belajar seo para pemula
  3. Suka duka selama bloging
  4. Seorang blogger tak akan kehabisan posting

Seperti dalam daftar diatas, list style yang digunakan adalah nomor. Coba perhatikan pula contoh berikut ini

Beberapa kontes seo tahun 2009

  • Belajar seo para pemula
  • Stop dreaming start action
  • Kenali dan kunjungi objek wisata di pandeglang
  • Kerja keras adalah energy kita

Beberapa kontes seo tahun 2009

  • Belajar seo para pemula
  • Stop dreaming start action
  • Kenali dan kunjungi objek wisata di pandeglang
  • Kerja keras adalah energy kita

Beberapa kontes seo tahun 2009

  • Belajar seo para pemula
  • Stop dreaming start action
  • Kenali dan kunjungi objek wisata di pandeglang
  • Kerja keras adalah energy kita

Nah terlihat jelas dari keempat contoh diatas menggunakan list-style yang berbeda. ada yang menggunakan angka, titik dan abjad sebagai list-stylenya. list-style tersebut juga dapat digunakan untuk mengurutkan daftar sahabat yang bertukar link dengan kita seperti pada blog ini di link exchange.

bagaimana cara membuatnya?

Secara sederhana kode html yang dipakai pada list style adalah sebagai berikut.

list-style-type: decimal;
list-style-type: disc;
list-style-type: circle;
list-style-type: square;
list-style-type: lower-roman;
list-style-type: upper-roman;
list-style-type: lower-alpha;
list-style-type: upper-alpha;
list-style-type: none;

kode-kode diatas dapat kita gunakan dengan mudah caranya adalah sebagai berikut:
Mari kita lihat kode html dari suatu daftar semacam daftar teman tukaran link

Beberapa kontes seo tahun 2009

<ul>

<li>Belajar seo para pemula</li>

<li>Stop dreaming start action</li>

<li>Kenali dan kunjungi objek wisata di pandeglang</li>

<li>Kerja keras adalah energy kita</li>

</ul>

Pada kode Ul yang berkedip diataslah kita memasang kode style nya. sehingga dari contoh diatas bila kita pasang kodenya menjadi seperti ini.

Beberapa kontes seo tahun 2009

<ul style=”list-style-type: lower-alpha;”>

<li>Belajar seo para pemula</li>

<li>Stop dreaming start action</li>

<li>Kenali dan kunjungi objek wisata di pandeglang</li>

<li>Kerja keras adalah energy kita</li>

</ul>

dan setelah kita coba lihat jika kode tersebut kita pasang menjadi seperti ini

Beberapa kontes seo tahun 2009

  • Belajar seo para pemula
  • Stop dreaming start action
  • Kenali dan kunjungi objek wisata di pandeglang
  • Kerja keras adalah energy kita

Nah bagaimana hasilnya bagus bukan setelah daftar kontes diatas diurut berdasarkan abjad atau lower alpha. Untuk menggantinya menjadi diurut dengan nomor atau yang lain, tinggal diubah kodenya berdasarkan daftar diatas.
Maaf kalau dari tutorial diatas ada yang tidak dimengerti. karena hanya ini yang bisa saya tulis.
udah dulu nulis posting kali ini soalnya mau instirahet capek juga. :)

Related Posts with ThumbnailsKata kunci terkait artikel ini:arti sidebar, list-style, list-style-type, membuat nomor posting blog, lengkap urut dan singkat merupakan syarat membuat, cache:Lq3F98U2VcMJ:anawia com/arti-kedutan-mata html pengertian membaca majalah, pengertian list, list style, pengertian sidebar pada blog, bagaimana cara membuat icon facebook berada pada sidebar di blog, cara memberi list pada sidebar, membuat icon pada list blogger, membuat no urut html, membuat nomor dengan html, membuat nomor di html, MEMBUAT NOMOR DI POSTING, membuat nomor di sidebar, membuat nomor pada posting, membuat nomor pada posting dengan gambar, membuat menu suka facebook di sidebar blogger, membuat list posting blogger, membuat list judul pada blog, membuat icon side bar, membuat judul sidebar, membuat facebook & twitter chat pada blog

2 comments

  1. chugy says:

    Mksh ni bt info-y kren bozzz…..lams knl dr chugy…!!!

  2. pokoknya komentar deh… meski gak nyambung

Leave a comment