如何在使用bootstrap CDN时更改引导断点大小

Question

我在rails应用程序上有一个ruby。

我在application.html.erb文件中使用bootstrap CDN。

我想更改xs，s，m，lg。

的屏幕尺寸断点

有没有办法在application.css中覆盖它？

或者，有没有更好的方法来解决这个问题？

Answer 1

断点大小会影响已编译CSS中@media块的参数，其中包含特定屏幕大小的属性。一旦定义，它们将始终处于活动状态。使用此CSS的唯一选择是覆盖它定义的内容。这实际上意味着你不会使用你为所有客户提供的大量CSS。不太好。

实现您想要的最简单方法是使用您自己的配置值重新编译Bootstrap。使用Rails执行此操作的最简单方法是通过Bootstrap的官方Sass端口：bootstrap-sass (link to GitHub)。它几乎包含了入门所需的一切。

当然，这意味着没有BootstrapCDN ：毕竟，它只是不能满足您的需求。

您需要覆盖these variables。但请记住，Bootstrap最初是用LESS编写的，而不是Sass。 Sass中的变量前面有$，而不是@。因此，LESS中的@screen-xs将为$screen-xs。