Tutorial : Blockquote Hover Versi 2

Tuesday, November 22, 2011

.Assalamualaikum.

heyy korang semua ! oke , nak bagitau dekat semua ! tutorial akan apis pindah dekat blog ni . sebab malas da nak pakai blog banyak-banyak . serabut . so apis akan pindahkan satu-satu ke blog ni . so tak lama lagi blog lagi satu nak delete daa ~ hee ~ oke . kali ni apis nak share dekat korang blockquote versi kedua . hehe . oke , lets begin !




1) Design > Edit HTML

2) Ctrl + F code dekat bawah ni

.post blockquote {

3) Dah jumpe ? Copy code dekat bawah ni PASTE dekat BAWAH code yang korang carik tadi .


background:url(URL BACKGROUND);
border:1px solid #736F6E;
border-top-right-radius: 15px;
border-bottom-right-radius: 15px;
margin:1em 20px;
padding: 7px;
-webkit-transition-timing-function: ease-out;
-webkit-transition-duration: 1s;
-moz-transition-timing-function: ease-out;
-moz-transition-duration: 1s;
}
.post blockquote:hover {
background:url(URL BACKGROUND);
border-top-right-radius: 15px;
border-bottom-right-radius: 15px;
border-left: 10px groove #736F6E;
}

4) Preview and Save . Siap and korang boleh tengok hasilnya !

p/s : yang kaler merah tu korang boleh carik url background yang korang suke .
yang apis BOLD kan tu , korang boleh ganti ikut citarasa korang . code warna boleh carik dekat SINI.



No comments:

Post a Comment

Template Designer. Full Edit by Hafiz Zulkafly. All Right Reserved.