:link
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2015年7月.
尝试一下
p { font-weight: bold; } a:link { color: forestgreen; text-decoration-color: hotpink; } <p>Pages that you might have visited:</p> <ul> <li> <a href="https://developer.mozilla.org">MDN Web Docs</a> </li> <li> <a href="https://www.youtube.com/">YouTube</a> </li> </ul> <p>Pages unlikely to be in your history:</p> <ul> <li> <a href="https://developer.mozilla.org/missing-2">Random MDN page</a> </li> <li> <a href="https://example.com/missing-2">Random Example page</a> </li> </ul> 由 :link 和 :visited 伪类定义的样式可以被任何具有相同优先级的后续用户动作伪类(例如 :hover 或 :active)覆盖。为了适当地为链接设置样式,请按照 LVHA 顺序将 :link 规则放置在所有其他与链接相关的规则之前,顺序为 :link—:visited—:hover—:active。:visited 伪类和 :link 伪类是互斥的。
备注:使用 :any-link 来选择一个元素,无论它是否已被访问。
语法
css
:link { /* ... */ } 示例
默认情况下,大多数浏览器会对访问过的链接应用特殊的 color 值。因此,在你访问这些链接之前,它们通常会有特殊的字体颜色。(在那之后,你需要清除浏览器历史记录才能再次看到它们。)但是,background-color 值可能会保留,因为大多数浏览器不会在访问过的链接上设置该属性。
HTML
html
<a href="#ordinary-target">This is an ordinary link.</a><br /> <a href="">You've already visited this link.</a><br /> <a>Placeholder link (won't get styled)</a> CSS
css
a:link { background-color: gold; color: green; } 结果
规范
| Specification |
|---|
| HTML> # selector-link> |
| Selectors Level 4> # link-pseudo> |