說明
1、移動(dòng)端經(jīng)常喜歡設(shè)計(jì)間隙固定，每行3個(gè)的布局，故寫一個(gè)demo
寬度375效果圖
另一個(gè)寬度效果圖
代碼
<style>
.box{
overflow: hidden;
}
ul{
width: calc(100% + 10px);
padding: 0;
display: flex;
flex-wrap: wrap;
}
li{
list-style: none;
background-color: #f00;
flex: 0 0 calc(33.33% - 10px);
margin-right: 10px;
}
</style>
</head>
<body>
<div class="box">
<ul>
<li>1</li>
<li>1</li>
<li>1</li>
<li>1</li>
<li>1</li>
<li>1</li>
<li>1</li>
<li>1</li>
<li>1</li>
<li>1</li>
<li>1</li>
<li>1</li>
<li>1</li>
</ul>
</div>
</body>
