如何在 Bulma CSS 中为响应式设计设置基本字体大小

Question

通过Bulma.io 文档，我找不到如何为响应式设计设置基本字体大小。

根据这个关于设置初始变量的部分，我们可以设置类的初始值$size-1等。但是，我想为响应式设计设置非常基本的字体大小。即当屏幕尺寸为 980 像素时，基本字体大小应为 12 像素，而不是标准的 16 像素。因为上面提到的字体类 '$size-1' 是rem，它们也会自动调整大小。

所以，我的问题是，是否可以在 Bulma 中为响应式设计设置基本字体大小？或者我必须$size-1手动更改类的大小等。

谢谢

Answer 1

在导入 Bulma SASS 文件后添加此项。

html {
  font-size: 12px;
  @include tablet {
    font-size: 16px;
  }
  @include desktop {
    font-size: 20px;
  }
}

这会覆盖 $body-size 变量，但它仅用于设置html {font-size}所以这不会导致任何问题。