如何设置 Bootstrap @font-family-base？

Posted 2023-03-06

【中文标题】如何设置 Bootstrap @font-family-base？

【英文标题】：How to set Bootstrap @font-family-base?

【发布时间】：2013-08-11 19:19:17

【问题描述】：

Bootstrap docs说：

使用@font-family-base、@font-size-base 和@line-height-base 属性作为我们的排版基础。

这是否意味着有一个名为 @font-family-base 的 CSS 变量？

如何在 CSS 中进行设置以更改整个页面的字体？

【参考方案1】：

访问the Bootstrap docs on customization - 您可以在排版部分更改多个变量，例如@sansFontFamily、@serifFontFamily、@monoFontFamily、@baseFontSize 等

【讨论】：

@cja 在 RC2 之前，Bootstrap 3 定制器将被禁用。同时，获取已编译的 CSS 和 javascript。坚持住！

我注意到了。无论如何，我的电脑上有编译好的文件。当然我可以更改它们以实现我想要的字体？

【参考方案2】：

这不是 CSS 变量，而是 LESS variable。

您可以在variables.less 中找到（和编辑）它们。

【讨论】：

我的 Bootstrap 下载文件夹中没有更少的目录。 （几天前我拿到了最新版本。）

可能是因为我有 v3

那是因为你有编译好的 CSS 文件。您可以下载 LESS 文件并使用它们，或者如果您愿意，也可以使用已编译的文件

只是为了提供一些关于“CSS 根本没有变量”的更新信息 CSS 有一个 WIP 变量规范 dev.w3.org/csswg/css-variables

【参考方案3】：

对于 Bootstrap 3，打开您的 custom.css 并

body,
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 
    font-family: "Ubuntu", Helvetica, Arial, sans-serif!important;

【讨论】：

很糟糕，这是我可以让它工作的唯一方法，但是 - 它是 - 非常感谢它。

【参考方案4】：

见下文，放在 CSS 文件的顶部。

@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,700);