61,129
社区成员
发帖
与我相关
我的任务
分享多个DIV横排 div之间的间距一样
在一个div放很多的div，就是横排，比如每排5个，我想请教的是如何设置每个div之间的间距一样，而且每排的第1个div距离外层div左边的距离与每排的第5个div距离外层div右边0px，要兼容主流浏览器啊？一直没有找到设置的好办法。谢谢了
...全文
请发表友善的回复…
发表回复
看着是个昵称 2017-05-31
- 打赏
- 举报
可以使用js来实现
var n = $("div").size() //设置浮动的div的数目
for (var i = 1; i < n; i++) {
$("div").eq(4*i-1).css({ //4代表每行显示的数目，从0开始计数
"margin-right":"0",
})
};
话说有点呆 2017-05-31
- 打赏
- 举报
支持一下2楼
34818060 2017-05-29
- 打赏
- 举报
除了flex外;也可以设置inline-block或浮动来实现
沐沐坏小孩 2017-05-19
- 打赏
- 举报
楼上正解，建议楼主好好学学选择器
天际的海浪 2017-05-17
- 打赏
- 举报
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<title> 页面名称 </title>
<style type="text/css">
#box {
background-color: #999;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
height: 100%;
}
#box div {
border: 1px solid #f09;
background-color: #ff9;
width: 18%;
height: 60px;
}
</style>
</head>
<body>
<div id="box">
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>
<div>6</div>
<div>7</div>
<div>8</div>
<div>9</div>
<div>10</div>
<div>11</div>
<div>12</div>
<div>13</div>
<div>14</div>
<div>15</div>
</div>
</body>
</html>
