flex布局之一行显示4个,如果多于4个,自动换行
<div class="container">
<div class="item" style="background-color: #f8b9b9">1</div>
<div class="item" style="background-color: #f8300c">2</div>
<div class="item" style="background-color: #85e159">3</div>
<div class="item" style="background-color: #b9bcf8">4</div>
<div class="item" style="background-color: #f3dede">5</div>
<!-- 更多的.item元素 -->
</div>
.container {
display: flex;
flex-wrap: wrap;
justify-content: space-between; /* 可选的对齐方式 */
}
.item {
flex: 0 0 25%; /* 每个子元素占据容器宽度的25% */
}