Tutorial : Blockquote Hover Versi 4

Monday, November 28, 2011

.Assalamualaikum.


selamat pagi ! before apis pegi kelas , sempat lagi mengodek code . nak buat tutor baru . haha ! sebab arini jadual kelas pack , so takde mase nak update blog , so update awal pagi . oke , kali ni apis nak share satu lagi hover blockquote . hurm , camne effect die ? mai sini apis tunjuk sikit .



sebelum


 selepas

oke , nak buat macam tu ? meh sini apis tunjukkan macam mana .


1) Dashboard > Design > Edit HTML 


2) Ctrl + F code bawah ni 


.post blockquote {

3) Copy code bawah ni , PASTE dekat BAWAH code .post blockquote { yang korang carik tadi .


text-align:center;
}
.post blockquote:hover{
text-align:center;
background:url(URL BACKGROUND);
padding-top:10px;
border-top:3px solid #FF0000;
border-bottom:3px solid #FF0000;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
-webkit-transition-duration: 1s;
}


4) Preview and Save .

p/s: mane-mane yang apis bold kan tu , ubah ikot suka korang oke ! :D


siap . mudahkan ? haha . harap bile korang cube menjadi . hehe , ok lah . out dulu , kelas dah memanggil ! baii :D kalo tak jadi or something tak kena , tanye k !


selamat men-TRY !
AJA-AJA HWAITING !!

2 comments:

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