跳至内容

层叠样式表/超链接

来自维基教科书,开放世界中的开放书籍

a 选择器匹配超链接。它有四个常用的伪类:linkvisitedhoveractive。使用这些伪类的规则应该按照此顺序给出,以便动态效果优先于已访问/未访问状态。以下示例将显示一个黑色链接,当鼠标悬停在其上时变为绿色,当处于活动状态(鼠标按下时)时变为粉色。

a:link
 { color:black; background:gray }
a:visited
 { color:black; background:red }
a:hover
 { color:green }
a:active
 { color:pink }

当鼠标悬停在未访问链接上时,a:link 选择器和 a:hover 选择器都会匹配。由于 hover 规则最后出现,因此它的 color 声明优先于 link 规则的 color 声明。由于 hover 规则没有更改 background 属性,因此结果是灰色背景上的绿色文本。

:link:visited 伪类只能与 a 选择器一起使用。CSS2.1 允许 :hover:active 伪类与其他元素一起使用。但是,Internet Explorer 仅允许在锚元素上使用 :hover

华夏公益教科书