选择所有没有h标签的链接
问题描述:
我想强调所有链接,但是如果链接是h1,h2等,则不能。 这里是一个简单的CSS:选择所有没有h标签的链接
#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链接保持下划线。 有没有人有一招?
答
你的最后一个例子有正确的想法,如果你没有像这应该工作:
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
text-decoration: none !important;
}
答
您不必使用:not
。您只需选择标签但添加一个标签,以便选择链接的h1。通过执行以下它应该工作。
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
text-decoration: none !important;
}
查看更多单击here
答
没有必要让它!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;
}
它不会在输出上产生任何影响。
+0
FWIW,在这个特定的例子中,'text-decoration:none;'选择器不必在'text-decoration:underline;'选择器之后,因为它具有更高的特异性。如果他们具有相同的特征,他们只需要追赶,然后梯级就会发挥作用,而最后宣布的任何东西都会胜出。 – hungerstar
首先,从具有最少特异性的CSS选择器开始。是否有必要在CSS选择器中包含'#heatmapthemead-content-container .entry-content'?这是否过分矫枉过正?会做一些简单的工作,比如'h1 a'?根据需要始终以最小的特异性进行。 '重要的'通常用于非常特殊的情况,其中,这种情况似乎没有资格。 – hungerstar