我想input[type=text]从两个不同的父类中选择所有的孩子。
对于下面的css，哪种方法最干净？
.secciones * input[type=text]
.subsecciones * input[type=text] {
border: none transparent;
background-color: white;
}
您应该删除通配符选择器。你几乎从不想要它，因为它是一个非常广泛的选择器：
.secciones input[type=text],
.subsecciones input[type=text] {
border: none transparent;
background-color: white;
}
Css 从右到左解析，因此：.secciones input[type=text]:
- 全选input[type=text]
- 对于每个匹配过滤器：检查它是.secciones
<div class="secciones">
<div>
<input type="text" placeholder="I will match as one of my parents is .secciones" />
</div>
<input type="text" placeholder="I will match as one of my parents is .secciones" />
</div>
如果您添加通配符选择器，您基本上会说“检查是否input[type=text]是任何东西的子项。使用*最合适的选择器，您可以从“选择所有内容”开始，这是很多。
如果您想直接孩子一个选择，你可以这样做：.secciones >input[type=text]：
-选择所有input[type=text]
-对于每个匹配过滤器：它检查是一个直接的孩子.secciones
<div class="secciones">
<div>
<input type="text" placeholder="I will NOT match, my direct parent is NOT .secciones" />
</div>
<input type="text" placeholder="I will match, my DIRECT parent is .secciones" />
</div>
当您可能需要使用一个例子*：.hideNextElement + *：
<div class="hideNextElement">click me to show next</div>
<div>I can be ANY element. With some JS I can become visible.</div>
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句