如何将我所有页面的字体大小减少 20%（不是 EM）答案

【问题标题】：How to reduce all of my page's font-size by 20% (NOT EM)如何将我所有页面的字体大小减少 20%（不是 EM）
【发布时间】：2025-12-22 17:05:12
【问题描述】：

我目前正在开发一个国际化页面，仅针对日语，所有字体都应减少 20%（因为与字母字符相比，日语汉字真的很大）。

我已经有 css 规则，它只在更改为日语时才更改字体大小，但我不能只用 EM 缩小它，因为我有标题、段落和许多其他大小的文本，并且使用 (0.8em) 会缩小所有它们的不同之处，而不是预期的行为。

我尝试使用font-size: 80%。 font-size: calc(auto - 20%) 没有一个起作用。

您还有其他想法吗？我正在使用 Sass（scss）以防万一。如果使用 Scss 无法实现，我如何使用 JS 来完成它（可以是 vanilla 或 vue）

【问题讨论】：

font-size: 80% 是您应该使用的。和it works。如果您的情况不是这样，您必须提供一个minimal reproducible example，这将允许检查为什么它在您的示例中没有。
百分比没有按预期工作，我不知道为什么-我什至测试了 font-size: 100%，所有字体都应该保留，但它们没有。您可以给我任何额外的配置或提示吗？ @tao
我不明白为什么 % 对你不起作用，你应该提供一个最小的可重现示例。
更新：@mmaismma 80% 规则适用于“*”所有项目。有些项目是嵌套的，它不止一次应用了 80%，这就是正在发生的事情。

【解决方案1】：

如果% 因某种原因对您不起作用，您为什么不尝试使用font-relative units？

我建议你使用ch 或ex。

这两个单位都可以使用日文字体。

【讨论】：

【解决方案2】：

虽然我的其他答案应该可以正常工作，但您还可以做一件事来解决您的问题，即使用 class="jp" 将所有日文文本包装在 span 中，并将 font-size: 80% 应用于 .jp。

【讨论】：