Question

我们将大屏幕的引导程序设置为： -

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {

}

我想覆盖到max-width：1920px。如何在不破坏核心的情况下做到这一点？

注意：我通过bower维护我的前端依赖项，因此我希望在自定义CSS文件上维护更改。有没有办法超越＆＃34;那些配置？

Answer 1

使用文档上的自定义页面创建自定义版本。

http://getbootstrap.com/customize/#media-queries-breakpoints

Answer 2

您只需更新Bootstrap的_variables.scss文件即可。这些是您可用于更改断点的所有变量：

$screen-xs:                  480px !default;
$screen-xs-min:              $screen-xs !default;
$screen-phone:               $screen-xs-min !default;

$screen-sm:                  768px !default;
$screen-sm-min:              $screen-sm !default;
$screen-tablet:              $screen-sm-min !default;

$screen-md:                  992px !default;
$screen-md-min:              $screen-md !default;
$screen-desktop:             $screen-md-min !default;

$screen-lg:                  1200px !default;
$screen-lg-min:              $screen-lg !default;
$screen-lg-desktop:          $screen-lg-min !default;

$screen-xs-max:              ($screen-sm-min - 1) !default;
$screen-sm-max:              ($screen-md-min - 1) !default;
$screen-md-max:              ($screen-lg-min - 1) !default;

我不确定这是不是你的意思＆＃34;黑客核心＆＃34;，但我保证不是这样。这些值意味着要更改，正如他们在文件中的注释所示：

## Define the breakpoints at which your layout will change, adapting to different screen sizes.

如何更改引导媒体查询条件？

2 个答案: