Flex实现多行布局，列不满靠左对齐

实现思路：父元素设置display:flex;并且给其伪元素设置和子元素一样的宽，高度为0。代码如下：

<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="item"></div>
    <div class="item"></div>
</div>

<style>
    .box{
        display:flex;
        justify-content: left;
        flex-wrap: wrap;
    }
    .box .item{
        width:25%;
        height: 50px;
    }
    .box:after{
        display:block;
        content:'';
        width:25%;
        height:0;
    }
</style>