Twitter引导：marginbottom内置css类

是否有内置的边距底层类可供使用？ 我试过使用

bottom5

like

<div class="col-lg-2 bottom5"></div>

---

但是这不起作用。

尝试添加名为

margin-bottom-5

这些类使用以下格式命名：

{property}-{sides}-{size}

---

from:

没有您描述的边距引导类。原因可能是需要0到10秒或100秒的余量等级，以及需要多个单元，例如

px

，

em

，

%

，等等

您可以使自己的类相当容易。更容易与崇高的文本编辑器和多选

也就是说，您不想将每个样式规则抽象到html中。原始CSS对于元素的某些特定内容非常有用，例如边距。对每种样式使用引导类都会导致难以阅读HTML

---

这个问题被标记为bootstrap3，但是当您更新到bootstrap4时，有一个。

bootstrap4有一个间距特性，可以解决这个问题

但是，如果您坚持使用较旧的引导版本，或者不能全部使用它，并且如果您需要一个完整的边距和填充类列表，请看这里

/* MARGINS & PADDINGS */
.p-xxs {
  padding: 5px !important;
}
.p-xs {
  padding: 10px !important;
}
.p-sm {
  padding: 15px !important;
}
.p-m {
  padding: 20px !important;
}
.p-md {
  padding: 25px !important;
}
.p-lg {
  padding: 30px !important;
}
.p-xl {
  padding: 40px !important;
}
.m-xxs {
  margin: 2px 4px;
}
.m-xs {
  margin: 5px;
}
.m-sm {
  margin: 10px;
}
.m {
  margin: 15px;
}
.m-md {
  margin: 20px;
}
.m-lg {
  margin: 30px;
}
.m-xl {
  margin: 50px;
}
.m-n {
  margin: 0 !important;
}
.m-l-none {
  margin-left: 0;
}
.m-l-xs {
  margin-left: 5px;
}
.m-l-sm {
  margin-left: 10px;
}
.m-l {
  margin-left: 15px;
}
.m-l-md {
  margin-left: 20px;
}
.m-l-lg {
  margin-left: 30px;
}
.m-l-xl {
  margin-left: 40px;
}
.m-l-n-xxs {
  margin-left: -1px;
}
.m-l-n-xs {
  margin-left: -5px;
}
.m-l-n-sm {
  margin-left: -10px;
}
.m-l-n {
  margin-left: -15px;
}
.m-l-n-md {
  margin-left: -20px;
}
.m-l-n-lg {
  margin-left: -30px;
}
.m-l-n-xl {
  margin-left: -40px;
}
.m-t-none {
  margin-top: 0;
}
.m-t-xxs {
  margin-top: 1px;
}
.m-t-xs {
  margin-top: 5px;
}
.m-t-sm {
  margin-top: 10px;
}
.m-t {
  margin-top: 15px;
}
.m-t-md {
  margin-top: 20px;
}
.m-t-lg {
  margin-top: 30px;
}
.m-t-xl {
  margin-top: 40px;
}
.m-t-xxl {
  margin-top: 50px;
}
.m-t-xxxl {
  margin-top: 60px;
}
.m-t-n-xxs {
  margin-top: -1px;
}
.m-t-n-xs {
  margin-top: -5px;
}
.m-t-n-sm {
  margin-top: -10px;
}
.m-t-n {
  margin-top: -15px;
}
.m-t-n-md {
  margin-top: -20px;
}
.m-t-n-lg {
  margin-top: -30px;
}
.m-t-n-xl {
  margin-top: -40px;
}
.m-r-none {
  margin-right: 0;
}
.m-r-xxs {
  margin-right: 1px;
}
.m-r-xs {
  margin-right: 5px;
}
.m-r-sm {
  margin-right: 10px;
}
.m-r {
  margin-right: 15px;
}
.m-r-md {
  margin-right: 20px;
}
.m-r-lg {
  margin-right: 30px;
}
.m-r-xl {
  margin-right: 40px;
}
.m-r-n-xxs {
  margin-right: -1px;
}
.m-r-n-xs {
  margin-right: -5px;
}
.m-r-n-sm {
  margin-right: -10px;
}
.m-r-n {
  margin-right: -15px;
}
.m-r-n-md {
  margin-right: -20px;
}
.m-r-n-lg {
  margin-right: -30px;
}
.m-r-n-xl {
  margin-right: -40px;
}
.m-b-none {
  margin-bottom: 0;
}
.m-b-xxs {
  margin-bottom: 1px;
}
.m-b-xs {
  margin-bottom: 5px;
}
.m-b-sm {
  margin-bottom: 10px;
}
.m-b {
  margin-bottom: 15px;
}
.m-b-md {
  margin-bottom: 20px;
}
.m-b-lg {
  margin-bottom: 30px;
}
.m-b-xl {
  margin-bottom: 40px;
}
.m-b-n-xxs {
  margin-bottom: -1px;
}
.m-b-n-xs {
  margin-bottom: -5px;
}
.m-b-n-sm {
  margin-bottom: -10px;
}
.m-b-n {
  margin-bottom: -15px;
}
.m-b-n-md {
  margin-bottom: -20px;
}
.m-b-n-lg {
  margin-bottom: -30px;
}
.m-b-n-xl {
  margin-bottom: -40px;
}
.space-15 {
  margin: 15px 0;
}
.space-20 {
  margin: 20px 0;
}
.space-25 {
  margin: 25px 0;
}
.space-30 {
  margin: 30px 0;
}

---

这是由WebAppLayers拍摄的。我想作者不介意分享这个。它可能会为一些Web开发人员节省20分钟的时间。

现在在Bootstrap4中提供

范例-

边距底部和填充，尺寸为5

你可以用-

m for margin
p for padding

各方面：

t - top
b - bottom
l - left
r - right
x - both left & right
y - both top & bottom
blank -all sides

---

对于大小-0,1,2,3,4,5的更新：引导4类

Bootstrap 4个类来添加边距和填充

Bootstrap 4具有广泛的响应边距和填充实用程序类。它们适用于所有断点：xs（=576px）、md（>=768px）、lg（>=992px）或xl（>=1200px））：

这些类的使用格式为：

{property}{sides}-{size}

对于xs和sm、md、lg和xl的

{property}{sides}-{breakpoint}-{size}

如果财产是下列财产之一：

m

-设置边距

p

-设置填充

其中，边是以下其中之一：

t

设置页边距顶部或填充顶部

b

设置页边距底部或填充底部

l

-设置左边距或左边填充

r

-设置右边距或右边填充

x

-设置左侧填充和右侧填充或左侧边距和右侧边距（x轴）

y

-设置填充顶部和填充底部或边距顶部和边距底部（y轴）

空白-在元素的所有4个边上设置边距或填充 其中，尺寸为以下值之一：

0

-将边距或填充设置为0

1

将边距或填充设置为.25rem（如果字体大小为16px，则为4px）

2

将边距或填充设置为.5rem（如果字体大小为16px，则为8px）

3

将边距或填充设置为1rem（如果字体大小为16px，则为16px）

4

将边距或填充设置为1.5rem（如果字体大小为16px，则为24px）

5

将边距或填充设置为3rem（如果字体大小为16px，则为48px）

auto

-将边距设置为auto

参考链接：

如何使用

我只有一个顶部填充（1.5rem=24px）
我的四周都有衬垫（3rem=48px）
我的四周都有边距（3rem=48px）和底部填充（3rem=48px）

如果你想添加边距底部，你可以从

mb-0

添加到

mb-5

。

---

请参阅：

这是针对twitter-bootstrap-4 alpha的。OP问题被标记为twitter-bootstrap-3。此外，这似乎是在创建CSS文件之前使用的，这似乎与OP基于“内置”语言所要求的不同。您应该更新您的答案，因为Bootstrap 4引入了间距、广泛的速记响应边距和填充实用程序类来修改元素的外观。此问题标记为Bootstrap 3，但是我已经更新了我的问题，以反映Bootstrap 4的更新。您应该更新您的答案，因为Bootstrap 4引入了间距、广泛的速记响应边距和填充实用程序类来修改元素的外观。