时间戳

首页 > 解决方案 > Bootstrap 4.1.3 $font-family-base 被忽略

css - Bootstrap 4.1.3 $font-family-base 被忽略

问题描述

我正在尝试更改 Bootstrap 中的默认字体系列，但我的更改被忽略了。

这个问题在回购（https://github.com/twbs/bootstrap/issues/21595）上已关闭，但我仍然有问题。

> bundle info bootstrap
=> bootstrap (4.1.3)

我有bootstrap-custom.scss：

/*!
 * Bootstrap v4.1.3 (https://getbootstrap.com/)
 * Copyright 2011-2018 The Bootstrap Authors
 * Copyright 2011-2018 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 */

 ...
 @import "bootstrap/variables";
 ...

_variables.scss：

...
//== Typography
//
//## Font, line-height, and color for body text, headings, and more.

$font-family-sans-serif:  "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif !default;
$font-family-serif:       Georgia, "Times New Roman", Times, serif !default;
//** Default monospace fonts for `<code>`, `<kbd>`, and `<pre>`.
$font-family-monospace:   Menlo, Monaco, Consolas, "Courier New", monospace !default;
$font-family-base:        $font-family-sans-serif !default;
...

我将它导入application.scss到我的文件顶部：

@import "bootstrap-custom";
@import "variables";

如果我尝试这个 css，那是行不通的：

body {
  font-family: $font-family-base;
}

但是，如果我更改名称并$font-family-base在_variables.scss正文中使用新变量，它就可以工作。

我有什么问题吗？

标签： csstwitter-bootstrapsass

解决方案

这种可能性非常小，但是您是否正确检查了文件名？

从您的代码来看，自定义样式文件名似乎是bootstrap_custom.scss，而您导入的文件名是bootstrap-custom.

查看文件名中_（下划线）和-（破折号/连字符）的区别。

推荐阅读