定位多行Flex容器中每行的第一个项目

时间:2017-11-22 23:17:45

标签: css css3 flexbox

我有一个多线Flexbox容器display: flex; flex-wrap: wrap。如何将样式或css类应用于每行的第一项?

我唯一能想到的就是使用Javascript迭代项目并手动应用/删除类。我真的很喜欢纯粹的CSS解决方案。

我不知道提前弹性箱中有多少物品,或者他们的宽度最终会是什么。

1 个答案:

答案 0 :(得分:3)

CSS无法实现这一点。

当多行Flex容器的每一行中的第一个项目不可预测时,它超出了CSS的功能,因为每行中的第一项是任意的。它可能是首先放置的任何项目。

充其量,CSS可以匹配一个明确的模式。如果没有模式,您将需要其他技术。

尝试JavaScript。

CSS网格布局具有相同的限制: