Bootstrap中.row类的负左右边距。

Question

只是出于好奇，为什么Bootstrap使用左右margin为-15px，这将取消.container和.container-fluid类上的15px左右padding。
为什么要设置padding，然后在子元素上使用负边距来取消它？

- Omar A

Answer 1

在行上应用负边距可以避免第一列填充后留下的空白间隙。如若不这样做，整个布局看起来会有些缩进。

- pixlboy

---

但是容器上有15像素的填充。为什么会这样？为什么不改成这样：.container {padding-left: 0; padding-right: 0;} .row {margin-left: 0; margin-right: 0;} - Omar A

左右列内边距的存在是为了在列之间留下一个间隔，即分隔符。顺便说一句，Bootstrap提供了自定义构建选项，以便根据需求更改这些值。 - pixlboy

Answer 2

正如官方Bootstrap网站所说：

行是列的包装器。每个列都有水平填充（称为间隙），用于控制它们之间的空间。然后，在行上使用负边距来抵消这个填充。这样，您列中的所有内容在视觉上都对齐在左侧。

- Mhd Alaa Alhaj