CSS : Modifikasi Link Web Page
Yupzz sekarang kita modifikasi link Web Page, Ok langsung
aja praktek daripada diem aja…
<html>
<head>
<style type="text/css">
a.b:link {color:green;}
a.b:visited {color:brown;}
a.b:hover {color:red;}
a.c:link {color:green;}
a.c:visited {color:brown;}
a.c:hover {font-size:150%;}
a.d:link {color:green;}
a.d:visited {color:brown;}
a.d:hover {background:black;}
a.e:link {color:green;}
a.e:visited {color:brown;}
a.e:hover {font-family:monospace;}
a.f:link {color:green;text-decoration:none;}
a.f:visited {color:brown;text-decoration:none;}
a.f:hover {text-decoration:underline;}
</style>
</head>
<body>
<p>Arahkan Pointer pada link</p>
<p><b><a class="b"
href="#">Jika anda mengarahkan pointer pada link ini maka akan
berubah warna</a></b></p>
<p><b><a class="c"
href="#" target="_blank">Jika anda mengarahkan pointer
pada link ini maka ukuran link ini akan berubah</a></b></p>
<p><b><a class="d"
href="#">Jika anda mengarahkan pointer pada link ini maka
background link ini akan berubah</a></b></p>
<p><b><a class="e"
href="#" target="_blank">Jika anda mengarahkan pointer
pada link ini maka jenis huruf ini akan berubah</a></b></p>
<p><b><a class="f"
href="#">Jika anda mengarahkan pointer pada link ini maka dekorasi
textnya akan berubah</a></b></p>
</body>
</html>
Maka hasilnya akan seperti dibawah ini :
Maka hasilnya akan seperti dibawah ini :
Jika anda mengarahkan pointer pada link ini maka akan berubah warna
Jika anda mengarahkan pointer pada link ini maka ukuran link ini akan berubah
Jika anda mengarahkan pointer pada link ini maka background link ini akan berubah
Jika anda mengarahkan pointer pada link ini maka jenis huruf ini akan berubah
Jika anda mengarahkan pointer pada link ini maka dekorasi textnya akan berubah
Ket : syntax target =
“_blank” merupakan syntax untuk membuka tab baru pada Web Browser
Sekian ilmu dari saya, silahkan otak – atik sesuka anda
Simpan dengan link.html
0 Komentar:
Posting Komentar