- <-- Lihat itu (kosong)
- <-- 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...
kok buletnya masih tetep ada???gimana caranya biar url icon aja yang terlihat...???Bukan bulet ma icon
BalasHapusCoba di tambahkan ( list-style-display:none; )
BalasHapusInfo nya bermanfaat skali sob! Blogwalking n dah follow sob! Follow balik ya, dtunggu kunjungan baliknya, Thnk's.....
BalasHapusthanks sob. infonya..tapi gimna biar gambar ada di depan tulisan?
BalasHapus