SOURCE

<ul class="container">
	<li class="item">产品 1</li>
	<li class="item">产品 2</li>
	<li class="item">产品 3</li>
	<li class="item">产品 4</li>
	<li class="item">产品 5</li>
</ul>

*{padding: 0;margin: 0;box-sizing: border-box;}

body{
    width: 375px;
    margin: 0 auto;
    background: #f3f3f3;
}

ul,li{list-style: none}

.container{
    display: flex;
    
    flex-wrap: wrap;
    background: #fff;
    /* 也可以使用这个，现在去掉了 item 里面的 margin-left ，但是还是要处理单个的情况*/
    justify-content: space-evenly;
}

.item{
    width: calc((375px  - 30px ) / 2);
    height: 300px;
    background: green;
    color: #fff;
    padding: 10px;
    margin-top: 10px;
}

/* 选择最后一个元素，是单数的情况，左边要主动给 10px ，上面是自动设定的，右侧要给 auto ，这两个都是必须的 */
.item:last-child:nth-child(odd){
    margin-left: 10px;
    margin-right: auto;
}