澄清：

Question

嘿嘿，我的CSS有点生疏，所以请耐心等待:)。

我正在使用h2，h3，h4，h5，h6具有border-bottom属性的布局。我的一个页面使用h3来显示FAQ列表的标题，并且它有一个锚标记，因为有一个扩展/合约脚本处于活动状态（点击标题，FAQ出现在标题下方）。我不希望这些特定的h3元素具有边框。是否有可用于实现此目的的特定CSS语法？也许是这样的：

#content a,h3 {
    border-bottom:none;
}

这显然是错误的，因为它只会清除驻留在我的内容容器中的任何a / h3元素的任何底部边框。

谢谢！

澄清：

<h3><a href="#">Text</a></h3>

Answer 1

没有CSS选择器会根据父级选择元素。最好的解决方案是为FAQ容器提供ID或类，然后：

#faq h3 {
    border-bottom: none;
}

Answer 2

以下是每个css选择器匹配的示例。请注意，网络标准不允许将h3置于其中。

a h3 { styles }
<a href=""><h3>Hello</h3></a>

h3 a { styles }
<h3><a href="">Hello</a></h3>

Answer 3

请改用：

h3＆gt; a {text-decoration：none; }

这样做可以针对'h3'的每个'a'孩子

最喜欢使用类和标签选择器与ID，因为定位ID往往会降低您的css代码的灵活性和可扩展性。像在OOP中一样思考继承。

有关CSS选择器的进一步阅读和完整报道，您可以参考： http://www.w3.org/TR/2009/CR-CSS2-20090423/selector.html#child-selectors

干杯

Answer 4

#content a>h3 {  border-bottom:none; }

应该这样做。＆gt;意味着'下一个标签必须'。

#content a h3 {  border-bottom:none; }

可能也会奏效。

您可以将逗号用于多个规则，例如

h1, h2, h3 {
color: red;
}

红色h1到h3

如果H3也是超链接，请将样式应用于H3？

澄清：

4 个答案: