css - 使用网络 (@font-face) 字体

Question

我有一个基本问题，可能更多地涉及设计领域，但它仍然是一个网络编程。

假设我需要在我的 Web 应用程序中使用 Palatino-Linotype 字体。如何更好地将它嵌入到我的网页应用程序中？

我已知的方式:
1) 到 font.com 购买各种 palatino-linotype:normal、bold、italic、italic-bold。 4 个不同的文件。
2)然后我通过字体样式加载字体

@font-face {
    font-family: "Palatino-Linotype-normal";
    src: "..."
}
@font-face {
    font-family: "Palatino-Linotype-italic";
    src: "..."
}

3) 我有 4 种不同的字体，在 HTML 标记中我需要明确设置元素的字体以使其变为粗体、斜体或斜体粗体(这是我最不喜欢的)。

问题:
1) 是使用自定义网络字体的工作流程吗？
2)也许有一种方法可以将这种字体视为普通字体，即在父元素上仅设置一种字体，并且仅针对内部设置 style="font-style: italic;"如果我想让它们变成斜体。
3)关于性能的问题，网页字体的渲染速度是否与普通字体的渲染速度不同？

Answer 1

浏览器通常支持的合乎逻辑的方法是在单独的规则中声明每种字体，如

@font-face {
    font-family: foobar;
    src: url("foobar-regular.woff");
}
@font-face {
    font-family: foobar;
    font-style: italic;
    src: url("foobar-italic.woff");
}

然后声明font-family: foobar并使用 font-style: italic直接或间接通过<i> , <em> ，以及其他导致默认呈现为斜体的标记。

我已经以明显的方式简化了代码；自然地，您通常应该以不同的格式提供字体，以供浏览器识别。

像 FontSquirrel 这样的服务会生成不同的代码，但修复它们生成的代码或从头开始编写代码是相当简单的。

我有意使用“foobar”而不是“Palatino Linotype”，因为后者在法律上不能用作可下载字体；至少这是假设，除非另有证明。 (网络上有许多非法分发或销售字体的网站。)