Info-cupu is Your Knowledge!!

Membuat Shadow pada Link Hover

Label : , ,

Mungkin akang dan teteh sudah mengetahui tentang macam-macam style link menggunakan CSS, agar mempercantik tampilan atau berbeda dengan yang lain.
pada kesempatan kali ini info-cupu aka membahas pembuatan "link hover shadow".
link hover adalah style link ketika suatu link di arahkan cursor mouse , maka akan berubah menjadi warna sesuai links hover menggunakan CSS.  seperti Blog Info-cupu ini menggunakan
link hover shadow

Cara membuat link hover shadow style pada Blogspot :
1. Login to Blogger kemudian pilih "Layout" atau "Rancangan"
2. Klik pada "Edit HTML" dan berikan tanda checklist "Expand Template Widget"
3. Cari Kode ini (biasakan menggunakan shortkey ctrl+f, untuk memudahkan pencarian karakter pada browser)
 a:hover { ....
.... ;}

       
Biasanya letak code tersebut berada di paling atas !!
inputkan kode CSS ini atau akang dan teteh bisa menambahkan kode css ini :
text-decoration:none;color:#000;text-shadow:0 0 10px #FFF
Sehingga menjadi seperti ini :

a:hover { text-decoration:none;color:#000;text-shadow:0 0 10px #FFF };
Cara membuat link hover shadow style pada web : 
caranya sama.. hanya saja meletakannya di dalam kode CSS , contohnya :

<style type='text/css'>
body {
color: #FFFFFF;
background:#232323;}
a,a:visited{padding:0;margin:0;color:#ffffff;text-decoration:none}a:hover{text-decoration:none;color:#000;text-shadow:0 0 10px #FFF}
</style>
<div align="center"><a href="#">Membuat Shadow Link Hover</a></div>

Sekian tutorial dari info-cupu ...semoga berguna!! 

0 komentar

Posting Komentar

Looking for something?

Use the form below to search the site:

Browser Compatibility

' DZ template created by vir0e5


Chit-chat Jquery mixed by vir0e5

Links