Tutorial Unique Link Hover
 |
| sila klik gambar untuk lebih jelas lagi ;) |
Sebenarnya sudah ramai yang request D'ya tutorial ini, entah berapa bulan entah baru D'ya teringat.Hehehehe, jahatnya kan? Okay, baru hari ini D'ya terjumpa sumber code dari blog Belog Nadya.Credit kepada beliau.D'ya namakan tutorial unique link hover kerana link hovernya sangat unik (sila klik gambar kepada yang rabun ayam, ekeke) dan sangat berbeza dari link hover biasa. Now D'ya nak tunaikan request korang yang meminta D'ya buat tutorial ni, suka tak? Sila jerit dengan kuatnya, heehehe.Let's tutorial ;)
Pergi ke dashboard > design > edit HTML > tick expand widgets
Seterusnya search code di bawah ini okay, cari code yang serupa jika tidak jumpa code di bawah .a:hover {
Sila padam code yang lama dan gantikan dengan code yang baru di bawah ini.You all boleh godek-godek code di bawah mengikut kesesuaian blog okay ;)a:hover {
color: #ffffff;
background:#fa5ca3;
text-decoration:none;
border: #ffffff 2px dashed;
padding:3px 5px;
-moz-border-radius:10px;
}
Jom belajar bersama cikgu D'ya Marshmello :P
color → Ini ialah warna font anda.Contohnya D'ya gunakan code bewarna putih, jadi apabila pengunjung mengerakkan cursor pada link ia akan bertukar menjad putih.Untuk code warna sila klik di SINI . background → Warna background pilihan anda, kalau nak jadikan unique link hover ni cantik, selalulah godek-godek code ye... -moz-border-radius → Code ini sangatlah penting kerana code inilah yang mencantikkan lagi unique link hover kamu.So, you all boleh buat eksperiman code untuk menjadikan ia lebih cantik + comel lagi :P
Okay, kalau sudah siap preview dulu sebelum save.Sebarang pertanyaan boleh je tanya D'ya di kaunter komen di bawah hehehe.Selamat berjaya ;)
1 marshmallow komen