Home Tutorial Freebies Jatt & Kucing Others Blogwalking

28 September, 2011

TUTORIAL:: underline hover

Untuk code kali ni izzat nak ajar macam mana nak buat underline hover. Biasanya kita dengar header hover, blockquote hover dan link hover kan. Ni contoh underline hover.

Ini underline baru saya. Ohsem bukan?

Try hover mouse korang dekat underline izzat. effect yang izzat buat is transparent. Korang boleh buat pelbagai lagi effect sebenarnya. Tapi hari ni izzat nak ajar effect transparent. 

Mula mula macam biasa pergi Design >> Edit HTML

Ctrl+F search code ni
/* Header

Kalau jumpa paste code dekat bawah ata code /* Header tadi
u{
-webkit-transition:.4s;
text-decoration:none;
border-bottom:1px solid #FF95A9;
padding: 0.1px;
}
u:hover{
color:transparent;}
}

warna merah tu size border. Kalau nak tebalkan sikit just upkan no tu.
warna oren tu warna border.

Nie contoh code izzat

u {
color:#000000;
border-radius:3px;
-webkit-transition-duration: 2s;
}
u:hover {
background: #000000;
color: transparent;
}

No comments:

LinkWithin