warna dan hover link `

sering kita jumpai di blog sobat bloger kita yang penampilan linknya sangat menarik adapun ketika kita mengunjungi link tersebut kemudian berubah warna linknya . dan saya rasa anda pun juga bisa menerapkan / mengubah warna dan hover ( mouse over ) link pada blog anda . salah satunya yang paling menarik yaitu mengubah hover link menjadi tullisan miring ( italic ) , atau anda juga bisa menghilangkan underline ( garis bawah ) pada hover link di blog anda pada dasarnya . sebelum kita merubah / mengganti link di blog kita ada baiknya kalau anda tahu sedikit mengenai link ini . ada 3 macam jenis link diantaranya yaitu :
a:active -->  link yang belum di apa - apa in
a:visited --> link yang sudah pernah di kunjungi / di klik
a:hover  --> link yang di di kunjungi pointer mouse ( belum di klik )
a:link --> link ketika sedang di copas ,di copy.
mengubah warna link
lihat kode css di bawah :
a {color:red;}
mengubah hover link menjadi tulisan miring dan warna link berbeda
a:hover {color:blue;font-style:italic;}
untuk menghilangkan underline pada hover link tambahkan aturan css sebagai berikut :
{text-decoration:none;}
maka gabungan kode css di atas akan seperti berikut :
a{color:red;}
a:hover{color:blue;font-style:italic;text-decoration:none;}
dan kode css ini di letakkan di atas / sebelum kode ]]></b:skin> atau </head> di dalam template anda :
namun kode css di atas secara global dimana link link yang ada di blog anda mengikuti aturan css di atas , bila anda ingin mengtur css tersendiri maka di perlukan id ( # ) atau class ( . ) contoh :

a.linkSaya {color:red;}
a.linkSaya:hover {color:blue;font-style:italic;text-decoration:none;}
hasil css link di atas
untuk penulisan html sebagai berikut :
<a class="linkSaya" href="http://www.id-mastony.blogspot.com/">hasil css link di atas </a>
note : penulisan ini wajib pada mode Html
bagi anda yang ingin link visited tidak sama anda tinggal menambahkan aturan css sebagai berikut:
a:active { disini aturan css ...}
a:visited{disini aturan css ...}
a:hover{ disini aturan css ....}

dan sampai disini tutorial tentang warna dan hover link ini selesai
semoga bermanfaat .....jangan lupa likenya  ...


Terima kasih Anda telah membaca Artikel mengenai warna dan hover link dan Kata kunci untuk Artikel ini yaitu warna dan hover link

4 komentar:

  1. Nice tutorial sob..kapan-kapan bakal saya terapkan nih di blog saya.

    Nice blog & Thanks :)

    BalasHapus
  2. @topSpot : silahkan sob ,,,thanks

    BalasHapus
  3. thx sob link dan pembelajaranya..

    BalasHapus
  4. @casanova : ma - sama sob ,, dan silahkan di coba . .

    BalasHapus

Silahkan Anda Komentarkan Tentang Post ini yang baik dan sopan,
Jangan sampai komentar anda dianggap spam . . .