如何添加边缘顶部类="行"元素使用twitter引导框架?
当前回答
just take a new class beside every row and apply css of margin-top: 20px;
here is the code below
<style>
.small-top
{
margin-top: 25px;
}
</style>
<div class="row small-top">
<div class="col-md-12">
</div>
</div>
其他回答
只需简单地使用这个bs3-upgrade帮助空格和文本对齐…
https://github.com/studija/bs3-upgrade
你可以使用下面的类进行引导4:
mt-0 mt-1 mt-2 mt-3 mt-4 ...
裁判:https://v4-alpha.getbootstrap.com/utilities/spacing/
好吧,只是让你知道发生了什么,我固定使用一些新的类Acyra上面说:
.top5 { margin-top:5px; }
.top7 { margin-top:7px; }
.top10 { margin-top:10px; }
.top15 { margin-top:15px; }
.top17 { margin-top:17px; }
.top30 { margin-top:30px; }
只要我想,我做<div class="row top7"></div>
为了更好的响应,你可以添加margin-top:7%而不是5px,例如:D
有时候margin-top会导致设计问题:
http://www.w3.org/TR/CSS2/box.html#collapsing-margins
所以,我建议创建“margin-bottom classes”而不是“margin-top classes”,并将它们应用到前一项。
如果你正在使用Bootstrap导入LESS Bootstrap文件,尝试用比例Bootstrap主题空间定义边缘-底部类:
.margin-bottom-xs {margin-bottom: ceil(@line-height-computed / 4);}
.margin-bottom-sm {margin-bottom: ceil(@line-height-computed / 2);}
.margin-bottom-md {margin-bottom: @line-height-computed;}
.margin-bottom-lg {margin-bottom: ceil(@line-height-computed * 2);}
您可以添加以下代码:
[class*="col-"] {
padding-top: 1rem;
padding-bottom: 1rem;
}