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

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;
}

要查看更多，请单击此处