:link

:link 选择器是一个伪类，它会定位页面上所有具有 href 属性的锚点 (<a>) 元素。

a:link {
  color: aquamarine;
}

上面的示例将所有链接的颜色更改为碧绿色。

当与 :hover 伪类组合使用时，:link 必须先出现，或者根本不定义，才能使 :hover 样式生效。这是因为它们的 特异性 相同，因此，如果 :link 放在后面，这些样式将覆盖悬停样式。请记住 爱与恨 的规则来确定正确的顺序。

:link 伪类将定位所有具有 href 属性的 <a> 元素，即使 href 的值为 空。因此，从这个意义上讲，它类似于 属性选择器 [href]。

以下是一些示例，用于查看哪些内容将与 :link 伪类匹配。

<!-- will be matched -->
<a href="https://css-tricks.org.cn">CSS-Tricks</a>

<!-- invalid HTML, but will still match -->
<a href>CSS-Tricks</a></code>

<!-- will not be matched -->
<a>CSS-Tricks</a>

只有三个 HTML 元素接受 href 属性：<a>、<link> 和 <area>。只有 <a> 元素可以通过 :link 伪类进行样式设置。此外，您不能将 href 属性添加到其他类型的元素并使其可以通过 :link 进行样式设置。换句话说，如果您有以下 HTML

<div href="https://css-tricks.org.cn">CSS-Tricks</div>

以下 CSS 将不起作用

div:link {
  color: aquamarine;
}

同样，HTML 将无法通过验证，因为 href 不是 <div> 的有效属性。

由于 :link 只能定位 <a> 元素，因此可以在 CSS 中定义 :link 样式，而无需使用元素类型选择器，如下所示

:link {
  color: aquamarine;
}

此外，在使用 HTML 的所有实际用途方面，:link 伪类在某种程度上是不相关的，因为可以通过简单地直接定位所有 <a> 元素来实现相同的效果。

a {
  color: aquamarine;
}

但是，如果页面上存在任何未设置 href 属性的 <a> 元素（例如，在使用 <a name="example"> 的旧版页面上），上述代码也将定位这些元素，这可能不是期望的结果。

还应该指出的是，从 CSS2 开始，其他文档语言（除了 HTML）可能会定义除锚点之外的其他元素，这些元素可以通过 :link 伪类进行样式设置。

浏览器支持

IE	Edge	Firefox	Chrome	Safari	Opera
全部	全部	全部	全部	全部	全部

Android Chrome	Android Firefox	Android 浏览器	iOS Safari	Opera Mobile
全部	全部	全部	全部	62

相关属性