Tùy chỉnh trạng thái liên kết (Link States)
CSS cung cấp 4 pseudo-class cho liên kết: :link (chưa truy cập), :visited (đã truy cập), :hover (di chuột qua), :active (đang click). Kết hợp với class để tạo nhiều kiểu khác nhau.
Ví dụ minh họa
<!DOCTYPE html>
<html>
<head>
<style>
a.first:link { color: #ff0000; }
a.first:visited { color: #0000ff; }
a.first:hover { color: #ffcc00; }
a.second:link { color: #ff0000; }
a.second:visited { color: #0000ff; }
a.second:hover { font-size: 150%; }
a.third:link { color: #ff0000; }
a.third:visited { color: #0000ff; }
a.third:hover { background: #66ff66; }
</style>
</head>
<body>
<p>Di chuột qua các liên kết dưới đây:</p>
<p><b><a class="first" href="demo1.html" target="_blank">Liên kết đổi màu</a></b></p>
<p><b><a class="second" href="demo2.html" target="_blank">Liên kết đổi cỡ chữ</a></b></p>
<p><b><a class="third" href="demo3.html" target="_blank">Liên kết đổi nền</a></b></p>
</body>
</html>Mỗi lớp (first, second, third) có hiệu ứng hover riêng biệt: đổi màu, đổi cỡ chữ, đổi nền.