Memodifikasi Gaya Bulet Unorder List UL & LI

Agar tidak selalu bosan dengan gaya <UL> dan <li> yang selalu begitu dengan gayanya, contohnya seperti ini

<-- Lihat itu

• <-- Yang ini juga

Yang seperti ini mungkin sudah menjadi hal yang sangat biasa sekali di dunia pemrograman, bagaimana jika sekarang mengedit bulet <ul> dan <li> menjadi gambar!
Pertama buat dulu gambar yang berukuran 20x20px bisa bentuk panah atau icon emoticom juga bisa, tapi inget gambar tidak boleh terlalu besar.
Jika sudah mempunyai gambar yang bakalan menggantikan buletnya <UL> dan <LI> ikuti langkah berikut.

Pertama login dengan akun anda, lanjut ke Tata Letak > Edit HTML
cari kode seperti ini ]]></b:skin>
Jika sudah ketemu taruh kode berikut ini tepat di atas kode tersebut

.post ul{list-style-type:none;
margin:10px 5px 0px;}
.post ul li{background:url(alamat gambar anda)no-repeat;padding:0px 0px 5px 30px;}

yang berwarna biru ganti dengan url gambar anda, anda juga bisa mengatur jaraknya di warna merah,
atau anda juga bisa menulisnya seperti ini

<ul style="background:url('http://www2.blogblog.com/rounders/icon_arrow.gif') no-repeat;
list-style-type: none;
margin: 0 0 5px;
padding-left: 20px;
">isi text
<li style="background:url('http://www2.blogblog.com/rounders/icon_arrow.gif') no-repeat;
list-style-type: none;
margin: 0 0 5px;
padding-left: 20px;
">isi textnya</li>
</ul>

Semoga ini bermanfaat buat anda...