html - 我的 Bootstrap 列有我无法删除的边距和填充

Question

我正在玩 bootstrap，刚刚发现我的 bootstrap 列似乎有内置的填充和边距。如何删除默认值？在我附上的示例中，我想例如 a) 将橙色和蓝色部分之间的距离减少到 0px 和 b) 删除左右边距。

Answer 1

这是我用于不想填充的一次性行:

.no-gutter > [class*='col-'] {
    padding-right:0;
    padding-left:0;
}

您显然可以将它应用于所有列，但老实说......在您这样做之前我会三思而后行。排水沟是有原因的。您不希望您的文本紧挨着其他文本等运行。

此外，如果您将背景颜色直接应用于列元素而不是列内的元素，背景颜色会接触但内部仍会为文本填充。

最后，在去除左右边距时要小心。每列都应该在一行中，每一行都应该在一个容器中。容器每边的默认边距为 +15。该行的边距为 -15。列有+15。这允许直接在容器中的内容和列中的内容在页面下方沿垂直直线对齐。否则，您的东西会左右跳动，看起来很奇怪。

任何事情都不应该直接连续进行。它要么在容器中，要么在列中。