Tutorial : Transparent Underline Hover


Assalamualaikum dan salam sejahtera kepada followers , readers dan blogwalkers yang dikasihi sekalian . Err siapa lagi yang aku tak sebut ?Stalkers ? Haters ? Copycaters ? Hamboi bnyak ters kau -_-

Family kita pergi balai polis wehh ! Haha lekluu . Ada karaoke --' Macam apa je kan ? Polis pun nak ber-retis . Aku malas nak pergi . Muka ni muka penjahat , karang tak pasal pasal je kan . haha

Tutorial ni ada seseorang tanya . Tapi dah lama . Baru nampak -,- Haha sorry je . Busy takda masa nak buat tutorial . Tapi disebabkan tengah free ni buat lah kan :)

Code untuk underline hover ni aku amek daripada blogskin yang aku pakai dekat blog kedua . Tapi sekarang dah tukar dah template dia ;p Bagi yang taktahu underline tu apa boleh tengok tutorial aku yang NI .Contoh underline hover boleh tengok kat bawah ni

APIT BUDAK BAJET HOT --'

Ce korang try hover kan  mouse korang kat ayat tu  ? Apa jadi ? Dia menghilang kan ? Okay effect yang tu aku nak ajar . Aloo senang je lah . Let's get start babeh ;D

Memula macam biasa design > Edit html 

Ctrl+f dan cari code ni

/* Header

Jumpa tak ? Jumpa kan ? Bagus lepas tu copy code yang kat bawah ni lepas tu paste atas dia :)

u{
-webkit-transition:.4s;
text-decoration:none;
border-bottom:1px solid #FF95A9;
padding: 0.1px;
}
u:hover{
color:transparent;}
}

Jom belajar sikit  
Yang merah tu boleh tukar berapa-berapa size yang korang nak . Makin besar no tu makin tebal lah 
Yang oren tu warna border dia . Boleh tukar ikut korang . Taknak ada border ? Boleh letak background

background: #FF95A9

Korang nak buat bila dia hover background dia lak bertukar ?Korang paste kan je code kat atas ni kat bawah u:hover tu lepastu tukar warna background dia , senang kan kan ? Lepastu korang boleh lah save

Sekarang ada banyak effect cecanggih untuk underline hover . Antaranya boleh cuba sini , sini , dan sini  takpun sini . Canggih kan ? Hoho tu je lah . Assalamualaikum



3 comments:

Faqihah Husni said...

waaah! BESTNYAAA! Nak buatlah. TERBAAAAAIK!

nick dot anis said...

tq sharing dear:-)

★ LyllΛzhar ★ said...

yehoooo jadii ;) tengsss apit ;)

Subscribe