添加了 4 个字体文件，但只显示了 2 个样式

Question

我正在尝试手动将自定义字体添加到我的 WP 本地主机安装中，我目前所做的是：

从 fontsquirrel 下载 .woff 格式的字体 (Computer Modern)
取所需的 4 个文件 (Serif)：Roman (cmunrm)、Bold (cmunbx)、Oblique (cmunti)、Bold Oblique (cmunbi)
将4个文件放入文件夹C:\xampp\htdocs\sitename\wp-includes\fonts\latex
在style.css中写入以下内容

CSS代码

@font-face {
    font-family: "Computer Modern";
    src: url('http://localhost/sitename/wp-includes/fonts/latex/cmunrm.woff');
    font-style: normal;
}
@font-face {
    font-family: "Computer Modern";
    src: url('http://localhost/sitename/wp-includes/fonts/latex/cmunbx.woff');
    font-weight: bold;
}
@font-face {
    font-family: "Computer Modern";
    src: url('http://localhost/sitename/wp-includes/fonts/latex/cmunti.woff');
    font-style: italic, oblique;
}
@font-face {
    font-family: "Computer Modern";
    src: url('http://localhost/sitename/wp-includes/fonts/latex/cmunbi.woff');
    font-weight: bold;
    font-style: italic, oblique;
}
body {
    font-family: "Computer Modern", serif;
}

在WP编辑器中写入以下内容

HTML代码

This is normal text
<strong>This is bold text</strong>
<em>This is oblique text</em>
<em><strong>This is bold and oblique text</strong></em>

但结果是这样

似乎只加载了 Bold 和 Oblique，实际上是通过将 cmunti 替换为 cmunrm（Oblique with Roman）并将 cmunbi 替换为 cmunbx（Bold CSS 文件中的粗体斜线显示

这是什么原因造成的，如何解决？

Answer 1

在每个定义中明确使用 font-weight 和 font-style 是否有帮助？。它还添加了 css，使 strong/em 显式关联到 font-weight/font-style（可能不需要）。

Answer 2

不知道为什么，但这解决了问题

@font-face {
    font-family: "Computer Modern";
    src: url('http://localhost/sitename/wp-includes/fonts/latex/cmunrm.woff');
}
@font-face {
    font-family: "Computer Modern";
    src: url('http://localhost/sitename/wp-includes/fonts/latex/cmunti.woff');
    font-style: italic;
}
@font-face {
    font-family: "Computer Modern";
    src: url('http://localhost/sitename/wp-includes/fonts/latex/cmunbx.woff');
    font-weight: bold;
}
@font-face {
    font-family: "Computer Modern";
    src: url('http://localhost/sitename/wp-includes/fonts/latex/cmunbi.woff');
    font-weight: bold;
    font-style: italic;
}

添加了 4 个字体文件，但只显示了 2 个样式

4 font files added but only 2 styles displayed

css

wordpress

fonts