Để tạo kiểu liên kết với CSS, trước tiên chúng ta nên biết các trạng thái liên kết sau:liên kết, đã truy cập, di chuột và đang hoạt động. Sử dụng các lớp giả của phần tử neo để tạo kiểu cho các liên kết -
a:link for link a:visited forvisited link a:link for hover on link a:active for active link
Ví dụ
Bây giờ chúng ta hãy xem một ví dụ -
<!DOCTYPE html> <html> <head> <style> a:link { color: orange; text-decoration: underline; } a:hover { color: red; text-decoration: underline; } a:active { color: green; text-decoration: underline; } </style> </head> <body> <h1>Tutorials</h1> <p><a href="https://www.tutorialspoint.com/java">Java</a></p> <p><a href="https://www.tutorialspoint.com/chsharp">C#</a></p> <p><a href="https://www.tutorialspoint.com/jquery">jQuery</a></p> <p><a href="https://www.tutorialspoint.com/ruby">Ruby</a></p> <p><a href="https://www.tutorialspoint.com/pytorch">PyTorch</a></p> </body> </html>
Đầu ra
Ví dụ
Bây giờ chúng ta hãy xem một ví dụ khác -
<!DOCTYPE html> <html> <head> <style> a:link { color: blue; text-decoration: none; } a:hover { color: blue; text-decoration: none; } a:active { color: blue; text-decoration: none; } </style> </head> <body> <h1>Demo Heading</h1> <div> <p>This is the <a href="https://tutorialspoint.com">reference</a></p> </div> </body> </html>
Đầu ra