css - 在 css 中更改我的网络字体导致我在 "em"中定义的旧字体大小值不准确。如何解决？

Question

我有很多我重新定义字体大小的 css 类，例如:

.ko {font-size:2.2em;}
.szik {font-size:2.8em}

现在我用自定义字体替换我的默认字体，我定义一个新字体:

@font-face {
font-family: BebasNeue;
src: url("http://acc-road.com/page/media/BebasNeue.otf") format("opentype");
}

我的问题是旧的字体大小与新的不匹配，这是我重写所有代码的最后机会。我可以轻松解决这个问题吗？如何？

我尝试了这个解决方案，但它不起作用。

@font-face {
    font-family: BebasNeue;
    src: url("http://acc-road.com/page/media/BebasNeue.otf") format("opentype");
    font-size: 10.5em;
    font-size-adjust: 10.5;
}

感谢您的回答。

Answer 1

当您更改字体系列时，字体大小根本不会改变，但字符的尺寸会改变。如果这是一个问题，您需要重新考虑您对字体系列和字体大小的选择。

你没有描述你是如何使用字体的，所以我来猜一猜。假设您的复制文本字体是 Arial，并且您使用 Bebas Neue 作为标题。在 Bebas Neue 中，所有字母都与 Arial 中的大写字母一样高。这是一种故意丢失大小写区分的奇怪字体，这有其含义。 (例如，如果您使用像 2.8em 这样的巨大相对字体大小，则在 BebasNeue 中与复制文本 Arial 相比，字母的大小会变得更大。)如果您使用它，您只需要相应地选择字体大小。如果您以受控方式设置标题字体大小，这应该不是什么大问题。

原则上，您可以使用 font-size-adjust根据字体系列调整字体大小，但它适用于相对 x 高度(10.5 将是一个荒谬的值)，并且它仅受 Firefox 支持，但方式不正确。