Tutorial : Underline hover I

Sebelum Hover

Selepas Hover

Nak buat tak underline macam atas tu? Kalau nak buat, ikut step yang berikut..

1) Log in > Dashboard > Design > Edit Html 

2) Search code

/* Header

3) Copy code ni dan paste kan di atas kod yang korang cari tadi..


u {
text-decoration:none;
background: #D0A9F5;
-webkit-transition-duration: 4s;
color: #ffffff;
-moz-border-radius: 3px;
filter:alpha(opacity=100);
-moz-opacity:1.0;
opacity:1.0;
border-radius: 5px;
padding-top: 1px;
padding-bottom: 1px;
padding-left: 2px;
padding-right: 2px;
}
u:hover {
text-decoration:none;
background: #FFFFFF;
-webkit-transition-duration: 3s;
color: #D0A9F5;
border-bottom: 2px solid #D0A9F5;
}

4) Preview dulu, kalau tak ada error, terus save!

Merah : Background Underline
Orange : Warna text underline
Biru : Background Underline selepas di hover
Hijau : Warna text underline selepas di hover
Pink : Border di bawah underline selepas di hover

#Boleh cari kod warna di sini!

No comments:

Post a Comment