CSS:在所有元素中按比例放大自定义字体

Question

我想使用自定义字体。当我使用

@font-face {
    font-family: 'Echelon';
    src: url('font/echelon-rg.ttf');
    font-style: normal;
}
@font-face {
    font-family: 'Echelon';
    src: url('font/echelon-it.ttf');
    font-style: italic;
}

然后它比我的浏览器中可用的所有默认字体都小。我想放大它们，比如说到当前大小的 150%。问题是当我这样做时

body * {
    font-family: Echelon;
    font-size: 150%;
}

然后所有 h1..h6、p、div、span 元素共享相同的大小（引导程序的所有自定义设置也被覆盖），我不能那样使用它。我想将所有元素相对于其原始大小（例如引导）进行更改。如果我手动完成，我将不得不重写数百个元素，所以这是一个糟糕的选择。我怎样才能以干净和简单的方式做到这一点？

PS 这与窗口/屏幕尺寸无关。

Answer 1

不要声明

body ，而是尝试在 CSS 中声明您需要更改的某些部分，这样您就不需要手动更改。比方说，您希望您的段落单独达到 150%，然后声明为：p{ font-size： 150% } 在你的 CSS 中，这应该仅限于段落。希望有帮助：-）