-->
  • Privacy Policy
  • Contact Us
  • Disclaimer

Blogger Pontang

SHARE TRIK DAN TIPS | SCRIPT PHP | FREE HOSTING | BISNIS | JAVA SCRIPT | SEPUTAR BLOGSPOT | INFO UNIK DAN LAINNYA

Mengenai Saya

My photo
Faqih
View my complete profile
Powered by Blogger.
  • Home
  • Privacy Policy
  • Contact Us
  • Disclaimer

Thursday, 1 April 2010

Variasi List-Style-Type

list style type Mungkin sebagian blogger belum banyak yang mengerti fungsi dari list-style-type. List-style-type sendiri berfungsi sebagai penanda bullet icon blog, sobat bisa melihat contohnya pada icon panah warna kuning yang ada di sidebar blog saya. Beberapa pertanyaan muncul yang menanyakan cara membuat icon warna kuning seperti di blog saya.

 

Saya pernah membahas sebelumnya di postingan cara memasang icon tab di sidebar blog, namun pada saat itu contoh yang saya gunakan menggunakan image icon dengan url atau icon yang sudah di simpan sebelumnya di hosting. Saya akan berikan beberapa kode dari list-style-type yang bisa sobat gunakan.

 

  • list-style-type: disc;
  • list-style-type: lower-greek;
  • list-style-type: circle;
  • list-style-type: hewbrew;
  • list-style-type: square;
  • list-style-type: armenian;
  • list-style-type: decimal-leading-zero;
  • list-style-type: georgian;
  • list-style-type: lower-roman;
  • list-style-type: cjk-ideographic;
  • list-style-type: upper-roman;
  • list-style-type: hiragana;
  • list-style-type: upper-alpha;
  • list-style-type: katakana;
  • list-style-type: lower-alpha;
  • list-style-type: hiragana-iroha;
  • list-style-type: none;
  • list-style-type: inherit;

 

  • Silahkan login ke blogger.
  • Tuju Tata Letak.
  • Klik Edit HTML.
  • Cari kode "list-style-type", jika list-style-type tersebut terletak di bagian css sidebar, maka yang akan sobat ubah adalah icon bullet pada sidebar.
  • Contohnya seperti ini :
    #sidebar ul { padding:0; margin:0; color:#FFF }
    #sidebar ul li { list-style-type:square; padding-left:5px; margin:8px 0 0 20px }
  • Ubah dan sesuaikan dengan keinginan sobat, contohnya di ubah menggunakan decimal-leading-zero, maka ganti hasilnya menjadi : 
    #sidebar ul { padding:0; margin:0; color:#FFF }
    #sidebar ul li { list-style-type:decimal-leading-zero; padding-left:5px; margin:8px 0 0 20px }
  • Simpan Template.

 

Untuk list-style-type: square bisa sobat lihat pada bagian bawah blog ini. sobat bisa melihat icon kotak kecil yang tampil sebelum isi dari recent post di bawah.

 

image

 

Semoga bermanfaat.

Sejarah pada tanggal 17:44

No comments:

Post a Comment

‹
›
Home
View web version

About

Search Engine Optimization

Patner Links

  • Google Blogs
  • Catatanku

Follow by Email

Subsribe to get post update from this blog in your email inbox.

Copyright © Blogger Pontang. Redesign by You Must Know