css - 在 parent 中选择一定数量的 child 或 child 选择器。 CSS

标签 css css-selectors

有没有办法选择一定数量的子选择器?例如

<div class="parent">
  <div class="child-a">abc</div>
  <div class="child-b">def</div>
  <div class="child-c">ghi</div>
  <div class="child-d">jkl</div>
  <div class="child-e">mno</div>
  <div class="child-f">pqr</div>
  <div class="child-g">stu</div>
</div>

如何只选择 .child-a, .child-b, .child-c

或者只选择.child-d .child-e, .child-f ?

可以用 :nth-child 伪类来完成吗

  div.parent div:nth-child(1,2,3) { margin: 15px 0 0 0; display:inline }
  div.parent div:nth-child(4,5,6) { margin: 30px 0 0 0; display:inline }

? 类似的东西?

最佳答案

好吧,如果 div 有那些类,您可以简单地列出它们:

.child-a, .child-b, .child-c

如果你想用 nth-child 来做,你必须像这样列出它们:

.parent :nth-child(1), .parent :nth-child(2), .parent :nth-child(3)  

关于css - 在 parent 中选择一定数量的 child 或 child 选择器。 CSS,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6712382/

相关文章:

html - 在主要和嵌套 flex 容器之间设置包装优先级

javascript - Li click 无法与 select2 插件一起使用

jquery - $ ("#id") 仅选择第一个元素,但 $ ("div#id") 选择两个元素?

css - 使用 css 将第一个 a-tag 设置为粗体

html - CSS - 首字母选择不适用于 ID

css - 使用 css 选择器 nth-of-type 不起作用

html - 使 CSS 选项卡在悬停时弹出,而不会将页面的其余部分向下推

jquery - 创建 jQuery Accordion 菜单的更好方法?

javascript - 对齐在同一行

基于元素文本的 CSS 选择器?