Html 如何使用动画限制每行的项目？

如何在下面的弹性项目中设置每行的最大项目数？我想用动画制作每行4个项目：

。网格项{
显示器：flex；
柔性包装：包装；
弯曲方向：行；
}
.单元格项目{
填充：15px；
-webkit过渡：所有2秒轻松；
-moz转换：所有2秒轻松；
-ms过渡：所有2秒轻松；
过渡：一切都很轻松；
-webkit-box-flex:1；
-ms-flex:1；
弹性：1；
}
.单元格项目a{
背景色：#F2F2；
宽度：100%；
高度：200px；
显示：块；
}
.单元格项：悬停{
-webkit-box-flex:4；
-ms-flex阳性4例；
弹性生长：4；
-webkit过渡：所有1s轻松；
-moz转换：所有1秒轻松；
过渡：所有的1容易；
}

据我所知，你有两种可能性

1-添加间隔元件以强制分离。如果最大元素数为12，则可以使用伪元素（因为只有2个伪元素可用，所以最多可以设置3行）


。网格项{
显示器：flex；
柔性包装：包装；
弯曲方向：行；
}
.单元格项目{
填充：15px；
过渡：一切都很轻松；
弹性：1；
高度：200px；
背景颜色：银色；
利润率：10px；
}
.单元格项：悬停{
弹性生长：4；
}
.垫片{
弹性基准：100%；
}

你的意思是你想这样做@Liamm12是的，但不要手动将它们分成两组。回答得好！非常感谢。我的快速解决方案是将项目分为两组。