CSS中Flex布局控制每row的元素数量（没行3个）的问题
首先，布局是要row，而不是column。然后要实现的功能是row同一行的div数大于3时，主动换行。即每行div数不会超过3个，如何实现？补充：有个笨方法就是在div的...
首先，布局是要row，而不是column。
然后要实现的功能是row同一行的div数大于3时，主动换行。即每行div数不会超过3个，如何实现？
补充：有个笨方法就是在div的父级加div，每个父级带3个div，但这样不灵活，求在不改html的情况下通过css实现的方法。
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style type="text/css">
div {
display: flex; flex-flow: row; flex-wrap: wrap
}
div>div {
border: solid; width: 100px; height: 100px; margin: 10px
}
</style>
</head>
<body>
<div>
<div>box1</div>
<div>box2</div>
<div>box3</div>
<div>box4</div>
<div>box5</div>
<div>box6</div>
<div>box7</div>
<div>box8</div>
<div>box9</div>
<div>box10</div>
</div>
</body>
</html> 展开
然后要实现的功能是row同一行的div数大于3时，主动换行。即每行div数不会超过3个，如何实现？
补充：有个笨方法就是在div的父级加div，每个父级带3个div，但这样不灵活，求在不改html的情况下通过css实现的方法。
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style type="text/css">
div {
display: flex; flex-flow: row; flex-wrap: wrap
}
div>div {
border: solid; width: 100px; height: 100px; margin: 10px
}
</style>
</head>
<body>
<div>
<div>box1</div>
<div>box2</div>
<div>box3</div>
<div>box4</div>
<div>box5</div>
<div>box6</div>
<div>box7</div>
<div>box8</div>
<div>box9</div>
<div>box10</div>
</div>
</body>
</html> 展开
1个回答
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
