flex布局

 

flex

  两端对齐,列不满左对齐

  利用after或者before(适用于每行3或者4列)

.box:after {
    display:block;
    content:"";
    width: 30%;
    height:0px;
}
全部代码
.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; } <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>

 

上一篇:今日总结


下一篇:让sublime一行显示更多代码出现横向的滚动条,以及修改默认tab键长度