无法使用@font-face 显示自定义字体

Question

我正在使用@font-face 来尝试让字体 'Archisto' 加载到我的网页上。我是构建网页和使用@font-face 的新手。我遵循了几个教程中的所有步骤，并浏览了这里的多个主题，但我无法加载字体。

我在文件夹 http://www.unfoldmyworld.com/wp-content/themes/ashe/assets/css/Archistico.css

中上传了 css 文件

我把字体文件上传到文件夹http://www.unfoldmyworld.com/wp-content/themes/ashe/assets/fonts/FONT_11.TTF

.css 文件中的@font-face 代码如下所示：

@font-face {
    font-family: Archistico;
    src: url(http://www.unfoldmyworld.com/wp-content/themes/ashe/assets/fonts/FONT_11.TTF);

}

我正在调用带有自定义 CSS 的字体，如下所示：

.page-content h5{
    font-family: 'Archistico' !important;
    font-size: 50px !important;
    display: inline !important;
    color: #231400 !important;
}

我试图让它运行的页面是：www.unfoldmyworld.com

非常感谢您的帮助！

Answer 1

你和亲戚一起试过吗url？我在考虑 CORS（跨源资源共享）问题。

@font-face {
   font-family: Archistico;
   src: url('../fonts/FONT_11.TTF');
}

Answer 2

1- 添加到网页头部。<link href="//db.onlinewebfonts.com/c/50f290d070f58bdf56e1cc32e5636174?family=Archistico" rel="stylesheet" type="text/css"/>

-2 使用@import CSS 指令，将以下行添加到您的 css 文件中。(http | https)

@import url(//db.onlinewebfonts.com/c/50f290d070f58bdf56e1cc32e5636174?family=Archistico);

-3 使用字体声明字体。(http | https)

@font-face {font-family: "Archistico"; src: url("//db.onlinewebfonts.com/t/50f290d070f58bdf56e1cc32e5636174.eot"); src: url("//db.onlinewebfonts.com/t/50f290d070f58bdf56e1cc32e5636174.eot?#iefix") format("embedded-opentype"), url("//db.onlinewebfonts.com/t/50f290d070f58bdf56e1cc32e5636174.woff2") format("woff2"), url("//db.onlinewebfonts.com/t/50f290d070f58bdf56e1cc32e5636174.woff") format("woff"), url("//db.onlinewebfonts.com/t/50f290d070f58bdf56e1cc32e5636174.ttf") format("truetype"), url("//db.onlinewebfonts.com/t/50f290d070f58bdf56e1cc32e5636174.svg#Archistico") format("svg"); }

让我知道这是否适合您 :) 谢谢

无法使用@font-face 显示自定义字体

Can't get custom fonts to show using @font-face

css

wordpress

fonts

font-face