如何添加边缘顶部类="行"元素使用twitter引导框架?
当前回答
引导5
在Bootstrap 5中,你可以这样做:
<div class="row mt-X"></div>
其中X是从0(没有空格)到5(有很多空格)之间的数字。关于不同的边距/填充大小和特定于断点的控件的更多信息,请查看文档。
其他回答
引导3
如果需要在引导中分离行,可以简单地使用.form-group。这将在行底部添加15px的边缘。
在您的例子中,要获得margin top,可以将这个类添加到之前的.row元素中
<div class="row form-group">
/* From bootstrap.css */
.form-group {
margin-bottom: 15px;
}
引导4
您可以使用内置间距类
<div class="row mt-3"></div>
类名中的“t”使它只适用于“顶部”,有类似的类用于底部,左侧,右侧。数字定义了空间大小。
只需简单地使用这个bs3-upgrade帮助空格和文本对齐…
https://github.com/studija/bs3-upgrade
Bootstrap 4 alpha,用于margin-top: CSS类名的简写mt-1, mt-2 (mt-lg-5, mt-sm-2) 底部也一样,右,左,还有auto类ml-auto
<div class="mt-lg-1" ...>
在变量.scss中,单位从1到5 这意味着如果你设置mt-1它会给出。25雷姆的边距。
$spacers: (
0: (
x: 0,
y: 0
),
1: (
x: ($spacer-x * .25),
y: ($spacer-y * .25)
),
2: (
x: ($spacer-x * .5),
y: ($spacer-y * .5)
),
3: (
x: $spacer-x,
y: $spacer-y
),
4: (
x: ($spacer-x * 1.5),
y: ($spacer-y * 1.5)
),
5: (
x: ($spacer-x * 3),
y: ($spacer-y * 3)
)
) !default;
在这里阅读更多
https://v4-alpha.getbootstrap.com/utilities/spacing/#horizontal-centering
在.css文件中添加到这个类:
.row {
margin-left: -20px;
*zoom: 1;
margin-top: 50px;
}
或者创建一个新类并将其添加到元素中
.rowSpecificFormName td {
margin-top: 50px;
}
在Twitter引导中编辑或重写行是一个坏主意,因为这是页面脚手架的核心部分,您将需要没有顶部边距的行。
要解决这个问题,可以创建一个新类“top-buffer”,添加所需的标准裕度。
.top-buffer { margin-top:20px; }
然后在需要上边距的行div上使用它。
<div class="row top-buffer"> ...