嘿,我有以下 html 代码:
<div class='col-sm-7 foo'>...</div>
<div class='col-sm-5 foo'>...</div>
在我的 CSS 中:
.foo {
background-color: white;
}
我无法在它们之间添加一些边距,因为它们由于 Bootstrap 而占据了整个宽度。虽然我想在它们之间添加一个没有背景颜色的分隔符(10px 左右)。我怎样才能做到这一点(出于其他原因我必须使用 Bootstrap )。
最佳答案
您可以编辑列边距的对齐方式,并使用填充进行偏移:
Demo Fiddle
<div class='col-sm-7 foo'>...</div>
<div class='col-sm-5 foo'>...</div>
.foo {
background-color: white;
}
@media (min-width: 768px) {
.foo:first-of-type {
margin:0 5px 0 -5px;
padding-left:20px;
}
.foo:last-of-type {
margin:0 -5px 0 5px;
padding-right:20px;
}
}
body {
background:black;
}
关于css - 有两列占据全宽但带有分隔符,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30118464/