Bagi sebagian blogger, display atau tampilan blog itu memang jadi hal yang utama, meskipun tidak terlepas dari tema yang dianut oleh blog itu sendiri. Salah satu hal yang paling ditekankan adalah tampilan dengan background sebagai penghias dari design blog tersebut.
Salah satu dari format yang digunakan dalam membuat background itu adalah dengan gambar atau cukup dengan kode warna saja. Pernahkah kalian mengetahui bahwa tampilan background itu bisa kita buat transparant hanya dengan menggunakan kode CSS saja..??? kalau kamu belum tahu kita akan mulai tipsnya.
Hal pertama yang perlu dicermati adalah : kode yang kita gunakan adalah kode CSS, maka kita akan meletakkannya pada format kode CSS juga.
1. Copy kode dibawah ini
2. Letakkan pada kode CSS pada background blog kamu, contoh dibawah ini:
3. Simpan.
Penerapan untuk gambar postingan,
1. Tambahkan kode dibawah ini pada style kode image,
Contohnya :
Salah satu dari format yang digunakan dalam membuat background itu adalah dengan gambar atau cukup dengan kode warna saja. Pernahkah kalian mengetahui bahwa tampilan background itu bisa kita buat transparant hanya dengan menggunakan kode CSS saja..??? kalau kamu belum tahu kita akan mulai tipsnya.
Hal pertama yang perlu dicermati adalah : kode yang kita gunakan adalah kode CSS, maka kita akan meletakkannya pada format kode CSS juga.
1. Copy kode dibawah ini
filter:alpha(opacity=70); -moz-opacity:0.70; opacity:0.70; -khtml-opacity:0.70;
2. Letakkan pada kode CSS pada background blog kamu, contoh dibawah ini:
#wrapper{backgound:#000;filter:alpha(opacity=70); -moz-opacity:0.70; opacity:0.70; -khtml-opacity:0.70;....}maka hasilnya akan terlihat sebagai berikut:
lihat contoh berikut
3. Simpan.
Penerapan untuk gambar postingan,
1. Tambahkan kode dibawah ini pada style kode image,
style="opacity:0.4;filter:alpha(opacity=40)"
onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"
onmouseout="this.style.opacity=0.4;this.filters.alpha.opacity=40"
Contohnya :
<img src="Url Gambar" style="opacity:0.4;filter:alpha(opacity=40)"Jika penerapan kode pada setiap gambar dirasa sulit, kita bisa menambahkan kode CSSnya saja kedalam kode gambar. Copy kode dibawah ini, dan letakkan sebelum kode ]]></b:skin>
onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"
onmouseout="this.style.opacity=0.4;this.filters.alpha.opacity=40"/>
.post img{opacity:1;filter:alpha(opacity=1); this.style.opacity=6}Jika sudah simpan.
.post img:hover{opacity:.5;filter:alpha(opacity=100); this.style.opacity=1}
