CSS 3 adalah generasi CSS (Cascading Style Sheet) yang ke 3, banyak keunggulan CSS 3 dibandingkan generasi yang sebelumnya, dan sudah mulai digunakan browser-browser, yaitu diantaranya adalah Mozilla Firefox v 3.6 dan Safari V 3, semoga saja browser-browser lainya menyusul untuk mendukung CSS 3.
Nah sebenarnya topik kita kali ini adalah "Membuat image post blogger berbayang/shadow" dengan menggunakan CSS 3, terlihat seperti gambar di samping kiri. Nah bagaimana caranya? silahkan ikuti langkah-langkah dibawah ini dan buktikan kecanggihan CSS 3.
Setelah Log In ke blogger pada dashboard masuk pada bagian "Template" lalu ke "Edit HTML"
Cari kode yang mirip dengan kode berikut ini:
.post img {
- - -
- - -
}
Setelah ketemu, silahkan ganti attributnya dengan kode yang berwarna hijau di bawah ini:
.post img {
background:#FFFFFF;
border:1px solid $bordercolor;
padding: 7px;
-moz-box-shadow: 1px 1px 5px rgba(0, 0, 0, .5);
-webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, .5);
-goog-ms-box-shadow: 1px 1px 5px rgba(0, 0, 0, .5);
box-shadow: 1px 1px 5px rgba(0, 0, 0, .5);
}
Untuk ketebalan bayangannya bisa anda edit sesuai dengan keinginan anda. Silahkan edit angka-angka di atas.
Jika sudah selesai, silahkan di SIMPAN TEMLAPE nya. Dan lihat perubahannya pada postingan yang m,empunya gambar.
Semoga bermanfaat, mohon maaf jika ada kesalahan. Thank's (Jkt/2012)
