Question

假设我在CMS网站上使用非系统字体（例如，PT Sans）。所以我要做的是，我将使用@ font-face包含不同样式的字体系列（例如，Regular，Italic和Bold）。然后我将body的字体系列定义为PT Sans Regular。到目前为止一切顺利然后，我的客户端编辑网站中的一些文本内容。他为文本提供了不同的字体样式 - 就像他 boldens 一个重要的消息和 italicizes 的位置名称。总而言之，他以自己喜欢的方式对内容进行了风格化。也没问题。
但是，真正的问题是，网站如何知道如果有斜体文本，它应该使用PT Sans Italic而不是常规版本的字体，即使{{1 }} font是body's？

我一直在考虑这个问题，但我无法找到解决方案对于这样的情况，是否有可能的解决方案？

Answer 1

这绝对是可能的。这是你如何做到的：

@font-face {
    font-family: 'PTSans';
    src: url('pts55f-webfont.eot');
    src: url('pts55f-webfont.eot?#iefix') format('embedded-opentype'),
         url('pts55f-webfont.woff') format('woff'),
         url('pts55f-webfont.ttf') format('truetype'),
         url('pts55f-webfont.svg#PTSansRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'PTSans';
    src: url('pts56f-webfont.eot');
    src: url('pts56f-webfont.eot?#iefix') format('embedded-opentype'),
         url('pts56f-webfont.woff') format('woff'),
         url('pts56f-webfont.ttf') format('truetype'),
         url('pts56f-webfont.svg#PTSansItalic') format('svg');
    font-weight: normal;
    font-style: italic;

}

@font-face {
    font-family: 'PTSans';
    src: url('pts75f-webfont.eot');
    src: url('pts75f-webfont.eot?#iefix') format('embedded-opentype'),
         url('pts75f-webfont.woff') format('woff'),
         url('pts75f-webfont.ttf') format('truetype'),
         url('pts75f-webfont.svg#PTSansBold') format('svg');
    font-weight: bold;
    font-style: normal;

}

@font-face {
    font-family: 'PTSans';
    src: url('pts76f-webfont.eot');
    src: url('pts76f-webfont.eot?#iefix') format('embedded-opentype'),
         url('pts76f-webfont.woff') format('woff'),
         url('pts76f-webfont.ttf') format('truetype'),
         url('pts76f-webfont.svg#PTSansBoldItalic') format('svg');
    font-weight: bold;
    font-style: italic;

}

定义@ font-face字体时，请确保所有font-family名称都相同。然后为每种字体正确设置font-weight和font-style。因此，如果字体为粗体，请设置font-weight: bold。等

然后在你的CSS中你可以做到：

body {
    font-family: 'PTSans';
}

各种代码<strong> <em>等会选择匹配的正确字体。

在编辑内容时，定义的单一字体样式是否可以生成其他字体样式？

1 个答案: