a:link { color: blue; text-decoration: none; background-color: yellow; } a:visited { color: purple; } a:hover { color: red; text-decoration: underline; } a:active { background-color: green; }
链接未访问状态下,a:link属性被应用。在上述代码中,它的颜色被设置为蓝色,文字装饰被去掉,背景色被设置为黄色。
链接已访问状态下,a:visited属性被应用。在上述代码中,它的颜色被设置为紫色。注意:只有在链接在浏览器历史记录中出现过,并且浏览器设置没有被修改,才会应用此样式。
鼠标悬停在链接上状态下,a:hover属性被应用。在上述代码中,它的颜色被设置为红色,文字下划线被添加。
链接激活状态下,a:active属性被应用。在上述代码中,当用户点击链接时,背景颜色被设置为绿色。
通过这些状态的设置,大家可以更好地控制链接在不同状态下的外观和意义。在网页设计中,这些状态的使用非常普遍。