OTF字体不起作用，但ttf确实如此

Question

我在使用css设置字体时遇到问题。

目前我有：

@font-face {
    font-family: 'myfont';
    font-weight: bold;
    src: url('_layouts/Fonts/myfont.otf') format("opentype");
}

它不会将我的字体应用于样式，但如果我将其更改为：

@font-face {
    font-family: 'myfont';
    font-weight: bold;
    src: url('_layouts/Fonts/testfont.ttf') format("opentype");
}

（即使我将opentype保留为格式），它确实有效。

当然，我添加了一种风格：

font-family: 'myfont';

有人知道这个问题吗？

Answer 1

您需要加载相同字体（eot，ttf，otf和woff）的四个版本才能进行交叉浏览优化。你可能没有看到.otf，因为你的浏览器不支持它（这就是你需要4的原因）。

我建议你使用谷歌字体，这很容易，很快，它只是有效：https://www.google.com/fonts