Question

我想强调所有链接但不是链接是h1，h2等等。这是一个简单的CSS：

#heatmapthemead-the-content-container .entry-content a {
    text-decoration: underline;
}

这突出了所有链接，包括h1，h2，h3 当我使用：不是选择器它不起作用，而且h1，h2保持下划线

#heatmapthemead-the-content-container .entry-content a:not(h1,h2,h3) {
        text-decoration: none;
    }

我也用！重要的是：

h1,h2,h3,h4,h5,h6 a {
text-decoration: none !important;
}

但是h1，h2链接仍然有下划线。有人有诀窍吗？

Answer 1

没有必要让它成为!important。请看下面的例子。

a{
  text-decoration: underline;
}

h1 a,
h2 a,
h3 a{
  text-decoration: none;
}

<div>
  <h1><a href="#">Sample</a></h1>
  <p><a href="#">Sample</a></p>
  <h2><a href="#">Sample</a></h2>
  <div><a href="#">Sample</a></div>
  <h3><a href="#">Sample</a></h3>
</div>

您正在以错误的方式编写代码，将其写为

h1 a, h2 a, h3 a{
    text-decoration: none;
}

等等。

这样编写会使代码更具可读性，更容易找到错误。

h1 a,
h2 a,
h3 a{
    text-decoration: none;
}

虽然输出不会产生任何影响。

Answer 2

你的最后一个例子有正确的想法，如果你这样做就应该有效：

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
    text-decoration: none !important;
}

Answer 3

您不必使用:not。您所要做的就是选择标签，但在其旁边添加一个标签，以便选择作为链接的h1。通过执行以下操作，它应该可以工作。

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
    text-decoration: none !important;
}

要查看更多内容，请点击here

选择所有没有h标签的链接

3 个答案: