未设置另一个样式表的像素字体大小

Question

我创建了一个主题的 WordPress 子主题，该主题在 body 标签中设置字体大小，如下所示

body {
    font-size: 16px;
    font-size: 1rem;
}

这更像是一个 CSS 问题，但对于那些不太熟悉 WordPress 的人来说：我无法更改父主题中的样式，因为这是不好的做法，并且会被任何更新覆盖。所以必须接受他们在那里设置的内容并用我自己的样式表覆盖它。

但是，众所周知，上述做法是不好的做法，因为它不允许用户更改浏览器中的字体大小，也没有考虑到并非所有浏览器都有其基本字体-大小设置为 16 像素。

我可以在子主题中做什么来取消设置？我宁愿这样设置：

body {
    font-size: 0.625em
}

然后用 REM 设置每个元素的实际大小。但是，EM 值似乎没有覆盖父主题中设置的 PX 值。

有没有办法“取消设置”父母硬编码的字体大小？

Answer 1

这可能是一个优先问题。

可能的解决方案

您的子主题 style.css 可能比您的父母 style.css 加载得更快/更早。

在父样式表之后将子元素排入队列，因此您可以使用相同的 css 选择器覆盖父样式表，而无需使用 !important。

解决方法是关键字：

font-size: 0.625em !important

除了添加 !important 之外，您还可以更改 functions.php 中的一些设置

尝试 enquing 你的孩子主题的 css 像：

function child_theme_styles() {
   wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
   wp_enqueue_style( 'child-theme-css', get_stylesheet_directory_uri() .'/style.css' , array('parent-style'));

}
add_action( 'wp_enqueue_scripts', 'child_theme_styles' );?>

Answer 2

要取消设置font-size 规则，您可以使用：

font-size: initial;