自定义Bootstrap的装订线和列大小

Question

我们的设计师在不使用网格系统的情况下设计了网站，但幸运的是我找到了一个网格系统来适应它并播放一些设置。它仍然是12个网格，但是天沟和列大小与引导程序不同......我想在这一点上提出一些问题。

• 这是从Bootstrap的官方定制器或Bootstrap Live Customizer自定义引导程序的好行为吗？

• 当您想要同时自定义和保持响应时，最佳方法是什么？

我想要更改的设置是装订线尺寸和列尺寸。我知道如何使用bootstrap但我从未尝试过自定义它。我认为预先定制引导程序比使用填充/边距几乎每个元素都更好，我相信复杂的适应性响应。

计算它的正确方法是什么？例如，在Bootstrap的官方定制器上，我应该更改哪些字段？我应该如何计算所有屏幕尺寸的尺寸？

他在设计时也使用了1440 x 900。

在下面调整此网格设置的最佳方法是什么？在这里，我添加了适合设计的网格设置：

Answer 1

Bootstrap有一组变量，如果需要，可以在项目中覆盖这些变量。 _variables.scss

最大宽度：$container-max-widths，
列数：$grid-columns，
和装订线尺寸：$grid-gutter-width-base。
除此之外，您还可以为每种屏幕尺寸设置不同的装订线尺寸：$grid-gutter-widths。

您可以使用未预编译的bootstrap css文件，但可以使用它的scss版本并自行编译scss文件。

<强>更新

Ups，作者使用较少版本的Bootstrap。因此，您可以更改较少的变量：@gridColumns，@gridColumnWidth，@gridGutterWidth，等等。