flex布局一:左对齐,且间距等分
ul {
width: 400px;
height: 250px;
border: 1px solid green;
margin: 0;
padding: 0;
list-style: none;
/* flex */
display: flex;
flex-wrap: wrap;
}
li {
width: 100px;
height: 100px;
border: 1px solid red;
margin-left: calc((400px - 3*25%)/4);
}
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ul>