Question

我要导入的字体本来没有500的字体权重（这是Bootstrap开箱即用的字体权重之一）。如何更改默认值。我看了这里：https://getbootstrap.com/docs/4.1/getting-started/theming/#variable-defaults

Answer 1

您将使用SASS并设置适当的字体变量。默认情况下，500砝码仅用于$headings-font-weight。根据要导入的字体中可用的粗细设置粗细。

/* set font variable customizations */
$font-family-base: 'Montserrat', sans-serif; 

$font-weight-light: 300;
$font-weight-normal: 400;
$font-weight-bold: 700; 
$headings-font-weight: 800;

/* remember to import Bootstrap after the changes */ 
@import "bootstrap";

演示：https://www.codeply.com/go/tjqFpMnjfa

相关：How to extend/modify (customize) Bootstrap 4 with SASS

Answer 2

默认字体粗细为400，尽管默认标题粗细为500。这是_variables.scss的摘录，您可以在那里看到所有变量：

$font-weight-light:           300 !default;
$font-weight-normal:          400 !default;
$font-weight-bold:            700 !default;

$font-weight-base:            $font-weight-normal !default;

Answer 3

如果下载Bootstrap 4的源文件，它们将包含整个CSS的SASS文件。可以在 _variables.scss 文件中修改字体粗细。有多个字体粗细设置（按钮，标题等），因此只需搜索“字体粗细”并查看选项。进行更改后，您必须重新编译CSS才能起作用。

如何在Bootstrap中覆盖默认字体粗细

3 个答案: