NgeShare - Cara Membuat Efek Bayangan pada Gambar di Posting Blog

by - 8/02/2012


Pada kesempatan kali ini, saya akan memberikan tutorial untukmu yang ingin membuat atau memberikan efek bayangan pada gambar di postingan blogmu. Oke langsung saja kita simak tutorialnya berikut ini.

1. Login ke Blogger
2. Pada halaman Dashboard pilih menu "Tema"
3. Kemudian kamu tekan tombol "Edit HTML"
4. Pada fitur "Edit HTML", kamu cari kode .post-body img
5. Kemudian kamu tambahkan kode di bawah ini ke dalam elemen kode .post-body img
- Kode box shadow (normal)
box-shadow: 0 2px 4px 0 rgba(0,0,0,0.10);

- Kode box shadow-md (medium)
box-shadow: 0 4px 8px 0 rgba(0,0,0,0.12), 0 2px 4px 0 rgba(0,0,0,0.08);

- Kode box shadow-lg (large)
box-shadow: 0 15px 30px 0 rgba(0,0,0,0.11), 0 5px 15px 0 rgba(0,0,0,0.08);

- Kode box shadow-inner
box-shadow: inset 0 2px 4px 0 rgba(0,0,0,0.06);

- Kode box shadow-outline
box-shadow: 0 0 0 3px rgba(52,144,220,0.5);

Contoh pemasangan:
.post-body img {
padding: 1px;
background: transparent;
border: 2px solid transparent;
box-shadow: 0 2px 4px 0 rgba(0,0,0,0.10);
}

6.  Lalu Anda klik Simpan

Sawer


Anda suka dengan tulisan-tulisan di blog ini? Jika iya, maka Anda bisa ikut berdonasi untuk membantu pengembangan blog ini agar tetap hidup dan update. Silakan klik tombol sawer di bawah ini sesuai nilai donasi Anda. Terima kasih.

0 comments