文章/答案/技术大牛

发布

问@字体-脸不工作3
EN

Stack Overflow用户

提问于 2017-04-10 10:09:19

回答 2查看 856关注 0票数 0

我试着在测试页面上使用ttf字体，我已经将它转换为woff和woff2，但是浏览器不使用这种字体(我尝试了Opera、Chrome、Vivaldi、Firefox和Edge)。这是我的密码：

@font-face {
font-family: 'RM Typerighter old Regular';
src: url('/fonts/RM_Typerighter_old_Regular.woff2') format('woff2');
src: url('/fonts/RM_Typerighter_old_Regular.woff') format('woff');
src: url('/fonts/RM_Typerighter_old_Regular.ttf') format('truetype');
}

css

fonts

font-face

html

回答 2

Stack Overflow用户

回答已采纳

发布于 2017-04-10 10:17:25

这可能是因为您没有使用相对路径，请尝试如下：

@font-face {
  font-family: 'RM Typerighter old Regular';
  src: url('./fonts/RM_Typerighter_old_Regular.woff2') format('woff2'),
       url('./fonts/RM_Typerighter_old_Regular.woff') format('woff'),
       url('./fonts/RM_Typerighter_old_Regular.ttf') format('truetype');
}

票数 0

Stack Overflow用户

发布于 2017-04-10 10:16:26

您需要将所有字体文件放在一个src中，并用逗号分隔它们，如下所示：

@font-face {
    font-family: "RM Typerighter old Regular";
    src: url("/fonts/RM_Typerighter_old_Regular.eot?") format("eot"),
         url("/fonts/RM_Typerighter_old_Regular.woff") format("woff"),
         url("/fonts/RM_Typerighter_old_Regular.ttf") format("truetype");
}

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/43320381

复制

相似问题

问@字体-脸不工作3
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问@字体-脸不工作3EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问@字体-脸不工作3
EN