在下面的示例中,我想创建一个 CSS 规则,该规则仅适用于带有文本“Blockhead”的 header 。
<div class="gumby">
<span class="pokey"></span>
<h3>Blockhead</h3>
<h3>Clay rules</h3>
</div>
我可以使用括号吗,例如 (.gumby > .pokey) + h3
?如果不是,我的替代方案是什么?
最佳答案
不,括号不是 CSS 选择器中的有效运算符。它们保留用于函数符号,例如 :lang()
、:not()
和 :nth-child()
。
反正你不需要它们; .gumby > .pokey + h3
本身就可以正常工作。
这是因为总是读取一系列选择器和组合器 linearly .组合器没有任何优先级。选择器可以解释为
Select an
h3
element
that immediately follows an element with classpokey
that is a child of an element with classgumby
.
并且由于节点树的工作方式,此处使用同级和子级组合器意味着 .pokey
和 h3
都是 .gumby< 的子级
,在你的例子中是,因为它声明他们都是 sibling 。
关于css - CSS 选择器中是否允许使用括号?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5478920/