如何自定义CSS，专门放大特定类的字体大小答案

【问题标题】：How to customize CSS, specifically enlarge the font size of a specific class如何自定义CSS，专门放大特定类的字体大小
【发布时间】：2023-03-31 17:48:01
【问题描述】：

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

我遵循these 的指示。 This 是网站。我正在尝试放大页面标题类的字体大小。

【问题讨论】：

你得到这么多反对票的原因是因为你刚刚粘贴了链接，这些链接很快就会过时或被删除，因此这个问题将来对其他人没有任何好处。请为不起作用的代码创建一个最小且可重现的示例。

标签： css jekyll

【解决方案1】：

当您使用默认的 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;
}

【讨论】：

谢谢。我会玩它的。显然，这是新的。我更改了基本字体大小，但正如我所料，它改变了一切，但我只是想看看这些更改是否真的有效。

【解决方案2】：

嗯……试试看：

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

【讨论】：

Nah 也没有用。为什么我被否决了？愚蠢的问题？
您确定将它添加到正确的样式表中并且它没有被另一个样式表覆盖吗？
我创建了它所说的目录和文件，但我不确定。