间距
Bootstrap包括各种速记响应边距和填充实用程序类,用于修改元素的外观。
这个怎么运作
分配响应友好 margin or padding 带有速记类的元素或其边的子集的值。 包括对单个属性,所有属性以及垂直和水平属性的支持。 根据默认的Sass映射构建类,范围从 .25rem to 3rem.
符号
适用于所有断点的间距实用程序,从 xs to xl ,其中没有断点缩写。 这是因为这些类是从 min-width: 0 以及更高版本,因此不受媒体查询的约束。 但是,其余的断点确实包含断点的缩写。
这些类使用以下格式命名 {property}{sides}-{size} for xs and {property}{sides}-{breakpoint}-{size} for sm,md,lg ,和 xl.
哪里 属性 是其中之一：
m-对于设置的类marginp-对于设置的类padding
哪里 侧面 是其中之一：
t-对于设置的类margin-toporpadding-topb-对于设置的类margin-bottomorpadding-bottoml-对于设置的类margin-leftorpadding-leftr-对于设置的类margin-rightorpadding-rightx-对于同时设置了*-leftand*-righty-对于同时设置了*-topand*-bottom- 空白-对于设置了
marginorpadding在元素的所有4个面上
哪里 size 是其中之一：
0-对于消除marginorpadding通过设置为01-（默认情况下）用于设置marginorpaddingto$spacer * .252-（默认情况下）用于设置marginorpaddingto$spacer * .53-（默认情况下）用于设置marginorpaddingto$spacer4-（默认情况下）用于设置marginorpaddingto$spacer * 1.55-（默认情况下）用于设置marginorpaddingto$spacer * 3auto-对于设置了margin自动
（您可以通过将条目添加到 $spacers Sass映射变量。）
例子
以下是这些类的一些代表性示例：
水平居中
此外,Bootstrap还包括一个 .mx-auto 用于水平居中固定宽度块级内容的类,即具有以下内容的内容 display: block 和a width 设置-通过将水平边距设置为 auto.
<div class="mx-auto" style="width: 200px; background-color: rgba(86,61,124,.15);"> 居中元素 </div>负边距
在CSS中, margin 属性可以利用负值（ padding 不能）。 从4.2版开始,我们为上面列出的每个非零整数大小添加了负边距实用程序（例如, 1,2,3,4,5 ). 这些实用程序是自定义跨断点的网格列装订线的理想选择。
语法与默认的正余量实用程序几乎相同,但是增加了 n 在要求的尺寸之前。 这是一个示例类,与 .mt-1:
这是在中端自定义Bootstrap网格的示例（ md ）断点及以上。 我们增加了 .col 填充 .px-md-5 然后用 .mx-md-n5 在父母身上 .row.
<div class="row mx-md-n5">
<div class="col px-md-5"><div class="p-3 border bg-light"> 自定义列填充 </div></div>
<div class="col px-md-5"><div class="p-3 border bg-light"> 自定义列填充 </div></div>
</div>