我可以为CSS写一个循环吗

我有一个场景，我得到像这样生成的 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;
}

也许我是在做白日梦吧？

你不能用纯 CSS 来做循环，但是，如果你使用 SASS 或 LESS 之类的东西，那么你可以同时执行以下操作：

SASS:

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

LESS:

你能在 LESS css 中做一个 javascript for 循环吗？ https://stackoverflow.com/questions/7226347/can-you-do-a-javascript-for-loop-inside-of-less-css

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

.containerLength > div{
  float: left;
}

或者创建一个名为.float-left并将其应用到您想要向右浮动的每个元素。