我可以为CSS写一个循环吗？

Question

我有一个场景,我得到这样的ID生成

<div class="containerLength">
<div id="new-1"></div>
<div id="new-2"></div>
<div id="new-3"></div>
<div id="new-4"></div>
</div>

等等

有没有办法我可以通过循环编写一些css来定位它们？也许是这样的

#new[i; for(i=0; i<="containerLength.length"; i++)]{
float:left;
}

可能我白天做梦正确吗？

Answer 1

你不能用纯CSS做循环,但是,如果你使用像SASS或LESS这样的东西,你可以这样做:

SASS:

@for $i from 1 through 4
  .#{$class-slug}-#{$i}
    width: 60px + $i

少:

但是,假设您只想对每个嵌套应用相同的样式div,您可以这样做

.containerLength > div{
  float: left;
}

或者可能创建一个名为的类,.float-left并将其应用于您想要浮动的每个元素.