Tutorial : Image Hover ( Shadow + Border )

Assalamualaikum ^^

hyeppp.. hello loca peopleee... nak buat tuto lagi laaa...

hihihi... nak sharing at korang apa yang syaz tau... 

hope berguna la untuk korang yee...

oke3.. ari ni syaz nak buat tutorial image hover yang ada shadow plus border...

tau ke cam mana?? oke3.. meh tengok gambar at bawah.. tapi sebelum tu... 

mehhh laa KLIK SINI dulu... hihihi... TERIMA KASIH tauuu... :D

Okee.. ni gambar nyee... 

SEBELUM

SELEPAS DISENTUH CURSOR

Oke... jom 'ber'tutorial pulak... 

1. Log In --> Dashboard --> Template --> Edit Html..

2. Tekan F3, then korang search kod yang dekat bawah ni :

img {

dah jumpaa???? ok next..

3. Copy kod yang dekat bawah ni pulak :

filter: alpha(opacity=60); 

opacity: .6; 

-webkit-box-shadow: 0px 0px 20px #000000; 

-moz-box-shadow: 0px 0px 20px #cc33cc; 

-webkit-border-top-right-radius:30; 

-webkit-border-top-left-radius:30; 

-webkit-border-bottom-right-radius:30; 

-webkit-border-bottom-left-radius:30;}

img:hover {

filter: alpha(opacity=60); 

opacity: .60; 

border: 1px solid #cc33cc; 

border-radius: 50px; 

-moz-border-radius: 50px;

}

-moz-opacity:1.0;

opacity:1.0;

}

img:hover {

filter:alpha(opacity=80);

-moz-opacity:0.80;

opacity:.80;

}

4. Dah copy?? kalau dahhh.. PASTE kat bawah kod yang koran search tadi... 

5. PREVIEW... kalau suka boleh SAVE...

SELAMAT MENCUBA ^^