![img](https://img-mid.csdnimg.cn/release/static/image/mid/ask/021813824556129.png "#le把这个排版整理一下,初学者做不对
div +flex 布局 。还是建议自己做 遇到问题再问 直接给你 对你不好,你也掌握不了 。
你可以参考这个 ,里面细致的布局 你自己来 。
http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>flex布局</title>
<style>
*{
margin: 0;
padding: 0;
}
.parent {
width: 100%;
display: flex;
justify-content: space-around;
flex-wrap: wrap;
}
.parent>div {
width: 19%;
height: 400px;
background: red;
margin-top:12px;
}
</style>
</head>
<body>
<div class="parent">
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</div>
</body>
</html>
了解一下flex布局去运用一下,有什么问题可以咨询,选择flex实现这样的效果非常的简单