<div class="container"><div class="title">标题</div><div class="content"><div class="item"></div><div class="item" style="width: calc((100% - 30) / 3 * 2)"></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></div></div></div>

html,body{margin: 0;padding: 0;width: 100%;height: 100%;}.container{width: 100%;height: 100%;}.title{text-align: center;width:100%;height: 50px;line-height: 50px;background-color: #ccc;color: #fff;}.content{width: 100%;height: calc(100% - 50px);background-color: #fff;padding: 5px;box-sizing: border-box;display: flex;flex-wrap: wrap;align-content: flex-start;}.item{flex: 1;width: calc((100% - 30px) / 3);min-width: calc((100% - 30px) / 3);max-width: calc((100% - 30px) / 3);background-color: #ccc;margin: 5px;height: 300px;}