只需要在弹性盒子的容器加一个伪类元素,大小就是盒子内容的宽高就可以实现。

1
2
3
4
5
6
7
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
*{
padding: 0px;
list-style: none;
}
ul{
width: 1000px;
height: 800px;
border: 1px solid #000;
display: flex;
flex-flow: row wrap;
justify-content: space-between;
}
li{
width: 300px;
height: 300px;
border: 1px solid #456;
}
ul::after{
width: 300px;
height: 300px;
content: '';
}