效果图 代码 <body><section class="content"><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></section> </body> <style>.content {width: 100%;display: flex;flex-wrap: wrap;background-color: skyblue;}.item {flex: 0 0 calc((100% - 10px)/3);height: 120px;background-color: pink;/* 间隙为5px */margin: 0 5px 5px 0;}.item:nth-child(3n) {/* 去除第3n个的margin-right */margin-right: 0;} </style> 方法二 .item {/* flex: 0 0 calc((100% - 10px)/3); */width: calc((100% - 10px) / 3);height: 120px;background-color: pink;/* 间隙为5px */margin: 0 5px 5px 0; }