CSS ile linkler çok farklı şekillerde biçimlendirilebilir:
Linkler herhangi bir CSS özelliği ile stillendirilebilir (font,color vb).
Ek olarak, bir linke durumuna bağlı olarak farklı stiller uygulanabilir.
Bir link dört farklı duruma sahip olabilir:
a:link normal, ziyaret edilmemişa:visited daha önce ziyaret edilmiş linka:hover fare işaretcisinin link üzerine geldiği duruma:active linkin tam tıklandığı ana:link {
color: red;
}
/* ziyaret edilmiş link */
a:visited {
color: green;
}
/* fare işaretçisi link üzerinde */
a:hover {
color: hotpink;
}
/* tam tıklama anı */
a:active {
color: blue;
}
Herhangi bir metin linke çevrildiğinde altında otomatik olarak bir çizgi çıkar.
Bu çizgiyi kaldırmak için text-decoration:none özelliği kullanılır.
a:link {
color: red;
text-decoration:none;
}
/* ziyaret edilmiş link */
a:visited {
color: green;
text-decoration:none;
}
/* fare işaretçisi link üzerinde */
a:hover {
color: hotpink;
}
/* tam tıklama anı */
a:active {
color: blue;
}
Bir linke zemin rengi vermek için background-color özelliğini kullanabilirsiniz.
/* ziyaret edilmemiş link */
a:link {
background-color:#4CAF50;
}
/* ziyaret edilmiş link */
a:visited {
background-color:red;
}
/* fare işaretçisi link üzerinde */
a:hover {
background-color:#2196F3
}
/* tam tıklama anı */
a:active {
color: blue;
background-color:yellow;
}