CSS选择每行

Question

我如何选择每一行的第一个元素？

这就是我要做的事情：



黄色圆圈是两个元素连接的位置。我需要在这些之间添加间距，希望使用某种CSS选择器。如果需要，我可以使用任何其他语言。
该网站是响应式的，因此我不能只添加“＆amp; nbsp（分号）”  在中间或将使div在每一行都正确。这与以下内容相同：不是（：first-child）margin-left，因为每行的所有元素都向右移动。

因此，总结：

• 我需要在div之间添加间距，我已经标记了间距需要的位置
• 我不能使用margin-left，因为它会将下一行的div分隔到右边

我该怎么做呢？

Answer 1

您可能知道哪些屏幕宽度会跳到下一行，所以只需将这些断点用作:nth-child()选择器的提示。

例如：在屏幕上＆gt; 800px宽，每行显示4个块？在.classname:nth-child(4n+1)内将您想要的样式添加到@media screen and (min-width 800px) {}（每隔4个，从第1个开始）。

所以它看起来像这样：

@media screen and (min-width 800px) {
  .classname:nth-child(4n+1) {
    margin-right: 2px;
  }
}

当然，您必须使用:nth-child()选择器和断点来完全达到您想要的效果，但由于您还没有共享一小部分代码，我不知道它应该如何看待等。