flex
两端对齐,列不满左对齐
利用after或者before(适用于每行3或者4列)
.box:after { display:block; content:""; 30%; height:0px; }
全部代码
.box { display: flex; flex-wrap: wrap; justify-content: space-between; } .item { 30%; height: 50px; background-color: #f1f8ff; margin-bottom: 10px; } .placeholder { 30%; height: 0px; } <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>