Cara buat efek shadow pada image dibahagian post blog


CSS shadow adalah salah satu cara termudah untuk membuat effect bayangan pada image atau gambar.

Untuk membuat shadow image pada bahagian post, hanya ikut beberapa langkah yang mudah di bawah.

 1. Log in dashboard--> Template --> Edit HTML --> Proceed.

 2. Dengan menggunakan keyboard, tekan "Ctrl+F" cari kod  .post img

Contoh:

.post img {
background: () no-repeat right bottom;
padding: 0px 10px 10px 5px;
border: 0px;
}

 3. Seterusnya, salin kod css di bawah dan paste kod tersebut selepas atau di bawah kod  .post img {
-webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
-moz-box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
box-shadow: 2px 2px 6px rgba(0,0,0,0.6);

Contoh:

.post img {
-webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
-moz-box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
background: () no-repeat right bottom;
padding: 0px 10px 10px 5px;
border: 0px;
}

4. Akhir sekali, klik PREVIEW. Jika tiada sebarang mesej error terpapar, klik Save.

G+

0 comments:

Post a Comment