让 CSS 悬停样式只影响超链接

【问题标题】：Have CSS hover style affect only hyperlinks让 CSS 悬停样式只影响超链接
【发布时间】：2018-10-16 10:52:47
【问题描述】：

当我define styles for hyperlinks 时，“悬停”样式会影响<a> 标签仅用于定义 ID 而非超链接的部分，例如 <a id="a1">TEXT</a>。

我怎样才能只为<a> 标签包含超链接获得悬停样式？

【问题讨论】：

【解决方案1】：

你可以使用属性选择器……

a[href]:hover {

}

…或为链接和访问的链接定义悬停状态：

a:link:hover,
a:visited:hover {

}

您也可以不将a 元素用于非链接。

自 1990 年代中期引入 HTML 4 以来，any 元素只要有 id 就可以成为链接目标。

<section id="a1">
    <h2>TEXT</h2>
    <p>More content</p>
</section>

【讨论】：