最近遇到布局上要求item兩端對(duì)齊,且最后一行在列不滿(mǎn)的情況下要求左對(duì)齊,使用flex的justify-content: space-between;
實(shí)現(xiàn)時(shí)發(fā)現(xiàn)最后一行不能左對(duì)齊,而是兩端對(duì)齊方式。

# 網(wǎng)上查了一些資料,有兩種方法可以實(shí)現(xiàn)效果:
**1.添加幾個(gè)空item**(對(duì)我來(lái)說(shuō)最有效的,適用于大多數(shù)場(chǎng)景)
? ?根據(jù)布局列數(shù)添加空item,比如每行最大n列,那么在最后添加n-2個(gè)空item即可
```
<html>
<style>
.box {
? ? display: flex;
? ? flex-wrap: wrap;
? ? justify-content: space-between;
}
.item {
? ? width: 30%;
? ? height: 50px;
? ? background-color: #f1f8ff;
? ? margin-bottom: 10px;
}
.placeholder {
? ? width: 30%;
? ? height: 0px;
}
</style>
<body>
? <div class="box">
? ? <div class="item"></div>
? ? <div class="item"></div>
? ? <div class="item"></div>
? ? <div class="item"></div>
? ? <div class="item"></div>
? ? <div class="placeholder"></div>
? </div>
</body>
</html>
```

**2.利于after或者before(適用于每行3或者4列)**
```
.box:after {
????display:block;
????content:"";
????width: 30%;
????height:0px;
}
```