Css 自定义字体声明不支持'；行不通

我在css中使用以下代码：

@font-face {
    font-family: "rsfont";
    src: url("rsfont.ttf");
}

body {
    font-family: 'rsfont';
}

---

我在css文件所在的文件夹中有一个

rsfont.ttf

文件，但它就是不起作用。为什么？

您需要指定一种格式，要获得完全的跨浏览器支持，您应该添加woff和eot。以下代码将支持所有浏览器（只要您有正确的字体文件）

对于所有现代浏览器来说，您实际上只需要一个eot和woof文件

@font-face{
字体系列：rsfont；
src:url（rsfont.eot）；
src:url（rsfont.eot）格式（“嵌入式opentype”），
url（rsfont.woff）格式（“woff”），
url（rsfont.ttf）格式（“truetype”）
字体大小：400；
字体：普通
}

您可以尝试将其更改为以下内容

@font-face {
    font-family: "rsfont";
    src: url('rsfont.ttf') format('truetype');
}

---

但是，并非所有浏览器都支持相同的文件类型！您需要使用类似的方法将其转换为多个文件。您可以在此处查看兼容性矩阵：

。ttf字体适用于Safari、Android和iOS。要使字体在所有浏览器中工作，您需要使用字体生成器生成更多的字体格式。你可以用这一个

您的最终@fontface声明应该是这样的，以便在所有支持@fontface的浏览器中都能工作

@font-face {
  font-family: 'rsfont';
  src: url('rsfont.eot'); /* IE9 Compat Modes */
  src: url('rsfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('rsfont.woff') format('woff'), /* Modern Browsers */
       url('rsfont.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('rsfont.svg#svgFontName') format('svg'); /* Legacy iOS */
}

---

我将尝试使用转换字体。在fontsquirrel上找不到合适的下载链接，我会尝试一下，当它起作用时，我宣布这个答案是最好的。很高兴我能提供帮助：）