如何自定义CSS，特别是放大特定类的字体大小

Question

如何修改Jekyll minima 主题中.page-heading类的字体大小？

我遵循these条款。 This是该网站。我正在尝试扩大page-heading类的字体大小。

Answer 1

嗯......试试：

.page-heading {
    font-size: 45px !important;
}

Answer 2

当您使用默认的Jekyll主题（最小值）时，您需要编辑其样式表。

此主题将.page-heading类定义为：

.page-heading {
  @include relative-font-size(1.25);
}

所以它使用位于_sass/minima.scss的mixin。在您的gems存储库中找到minima gem（它将类似于/var/lib/gems/2.3.0/gems/minima-2.1.1/）并将该文件及其目录复制到Jekyll安装：

 mkdir -p _sass/
 cp /var/lib/gems/2.3.0/gems/minima-2.1.1/_sass/minima.scss _sass/

现在修改_sass/minima.scss并更改其字体大小，特别是，您需要更改$base-font-size变量：

$base-font-size:   16px !default;

@mixin relative-font-size($ratio) {
  font-size: $base-font-size * $ratio;
}