Link Styling
Link dapat ditata dengan properti CSS (misalnya warna, font-family, latar belakang, dll).
a {
color: yellow;
}
Selain itu, link bisa ditata secara berbeda tergantung pada apa state mereka berada.
Empat link state adalah:
- a: link - normal, link yang belum dikunjungi
- a: visited - link pengguna telah mengunjungi
- a: hover - link ketika mouse pengguna di atasnya
- a: active - link saat itu diklik
a:link {
color: yellow;
}
a:visited {
color: red;
}
a:hover {
color: blue;
}
a:active {
color: green;
}
Ketika menetapkan gaya untuk beberapa Link, ada beberapa aturan:
- a: hover harus datang setelah a: link dan a: visited
- a: active harus datang setelah: hover
Link Umum Styles
Dalam contoh di atas link berubah warna tergantung pada apa state.
Mari kita pergi melalui beberapa cara umum lain untuk link gaya:
Dekorasi teks
Properti text-decoration banyak digunakan untuk menghilangkan garis bawah dari link:
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
a:active {
text-decoration: underline;
}
Warna Latar Belakang
Properti background-color menentukan warna latar belakang untuk link:
a:link {
background-color: #B2FF99;
}
a:visited {
background-color: #FFFF85;
}
a:hover {
background-color: #FF704D;
}
a:active {
background-color: #FF704D;
}
0 komentar:
Posting Komentar