Header Ads

peluang usaha

Menghilangkan border gambar

Diposting oleh Unknown

Kadang kala sewaktu kita kita memasang gambar atau emoticons pada postingan akan telihat sebuah kotak yang mengelilingi gambar tersebut,tentu ini akan mengganggu sebuah postingan untuk dilihat.Contoh gambar yang mempunyai border : Kadang kala sewaktu kita kita memasang gambar atau emoticons pada postingan akan telihat sebuah kotak yang mengelilingi gambar tersebut,tentu ini akan mengganggu sebuah postingan untuk dilihat.
Contoh gambar yang mempunyai border :





 

Bandingkan dengan yang ini :




Lebih bagus tampilan jika gambar yang kita posting tidak mempunyai border/bingkai.

Cara untuk menghilangkan border adalah sobat harus membiasakan diri menambahkan kode border="0" pada setiap gambar yang di pasang.

Langkah pertama, menambahkan kode border=”0” pada image
Contoh saya mempunyai url image :
 

http://i1194.photobucket.com/albums/aa367/Edwinkurniawan/logo_96.jpg
 

maka kita harus sisipkan kode border =”0” tuk menghilangkan bingkainya menjadi:
 

<img border="”0”" src="http://i1194.photobucket.com/albums/aa367/Edwinkurniawan/logo_96.jpg"border =”0”>

Langkah kedua, modifikasi style sheet css pada kode html template

Blogger menyediakan 2 template bagi penggunanya,Baik template klasik maupun template modern mempunyai kode yang sama


cari kode ini .post img { <-- perhatikan kode ini
padding:4px; border:1px solid $bordercolor; <-- yang di rubah kode yg ini }

Rubah angka(satu) menjadi angka 0 (nol),sehingga kodenya menjadi seperti ini :
.post img { padding:4px; border:0px solid $bordercolor; } 

Langkah-langkahnya seperti ini
1.Sign in ID BLOGGER sobat 


2.Klik menu Rancangan 


 
3. Klik menu Edit HTML



 
4.Klik tulisan Download Template Lengkap, silahkan save dulu template sobat untuk backup data






5. Klik kotak kecil di samping tulisan Expand Template Widget [ template modern]


6.Tunggu beberapa saat sampai proses selesai


7.Cari kode berikut pada css sobat (ini contoh saja):

.post img { <-- perhatikan kode ini
padding:4px; border:1px solid $bordercolor; <-- yang di rubah kode yg ini } tentunya setiap template berbeda-beda, akan tetapi biasanya selalu ada kode .post img 


8.Rubah angka 1 (satu) menjadi angka 0 (nol),
sehingga kodenya menjadi seperti ini :
.post img { padding:4px; border:0px solid $bordercolor; }


9.Klik tombol SIMPAN TEMPLATE

Sekarang lihat tampilan gambar pada postingan tanpa ada gangguan lagi.

{ 0 komentar... read them below or add one }

Baca juga yang lain