Cara Membuat link berubah saat mouse diarahkan pada teks link

Merubah tampilan pada blog tidak terbatas hanya pada warna, icon, kolom komentar, guest book dll tapi juga bisa kita lakukan pada teks link, dengan sedikit penambahan kode script kita bisa merubah teks link / teks menjadi lebih besar atau dengan garis bawah pada saat icon mouse kita arahkan pada link tersebut.

caranya adalah sebagai berikut :

• Login ke akun Blogger kamu.
• Dari halaman dashboard, pilih Edit HTML.
• Pada halaman Edit HTML, centang "Expand Template Widget", cari kode dibawah ini  ( tekan F3 untuk memudahkan mencari kode )

Untuk Judul Posting

.post-title a:hover {
color:#cc0000;

Untuk teks link secara keseluruhan

body {
background: #0B3861;
background-image: url(http://i864.photobucket.com/albums/ab206/kibagus/menu%20animasi/headerimage-1.jpg);
background-attachment: none;
background-repeat: repeat-x;
background-position: none;
margin : 0;
padding : 0;
font : x-small Verdana, Arial;
text-align : center;
color : #BDBDBD;
font-size : small;
font-size : small;
}
a:link {
color : SkyBlue;
text-decoration : none;
}
a:hover {
color : #990000;

kode warna merah, menunjukan bahwa teks link tersebut akan berubah saat mouse icon diarahkan pada teks link tersebut ( warna, ukuran atau variasi lain yang di maksud )

pasang salah satu kode dibawah ini tepat dibawah kode diatas :

text-transform:uppercase;

text-transform:lowercase;

text-transform:capitalize;

Hasilnya :

contoh teks link uppercase

contoh teks link lowercase

contoh teks link capitalize

atau

text-decoration:underline;

text-decoration:overline;

text-decoration:line-through;

text-decoration:blink;

hasilnya :

contoh teks link overline

contoh teks link line-through

contoh teks link underline

contoh teks link blink
Note: The "blink" value is not supported in IE, Chrome, or Safari.



Demikian tutorial blog  Cara Membuat  link berubah saat  mouse diarahkan pada teks link

semoga bermanfaat..

selamat mencoba...!!