Css 如何仅在包装Flexbox中除第一个和最后一个项目外的所有项目上设置边距

假设我有一个覆盖多行的项目包装列表。然后我想在所有项目之间添加一个间隙。但是，我不希望在每行的第一项之前有间隙，在每行的最后一项之后没有间隙

您可以通过每行有一个明确的项目数来实现这一点，但我希望每行的项目数是动态的

到目前为止看起来是这样的，但我还没有弄清楚如何让它在没有边缘的情况下工作

.a{
显示器：flex；
柔性包装：包装；
弯曲方向：行；
背景：黄色；
}
.b{
宽度：50px；
保证金：5px；
高度：50px；
显示器：flex；
对齐项目：居中；
证明内容：中心；
背景：红色；
}

1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.

将列表包装在容器div中，为列表提供负边距以抵消列表项的边距，并隐藏容器中的溢出：

.c{
溢出：隐藏；
}
.a{
保证金：-5px；
}
/*您的原始CSS*/
.a{
显示器：flex；
柔性包装：包装；
弯曲方向：行；
背景：黄色；
}
.b{
宽度：50px；
保证金：5px；
高度：50px；
显示器：flex；
对齐项目：居中；
证明内容：中心；
背景：红色；
}

1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.
1.

为什么不标记“css”？您是否尝试过减少父容器的左侧填充和右侧填充？或者它已经是0了？您还可以使用

类型的第一个

和

类型的最后一个

css属性，并相应地设置样式