将自定义字体添加到龙门框架

Question

我正在尝试在 WordpressGantry 上向 Gantry Framework 添加一些自定义字体

到目前为止我所做的是：

在 wp-content/themes/my_theme_folder/custom/fonts 文件夹中，我上传了我的 eot、ttf、svg、woff 字体文件。

然后我在 custom.scss 文件中插入了代码：

@font-face {
font-family: 'war';
src: url('war-webfont-webfont.eot'); /* IE9 Compat Modes */
src: url('war-webfont-webfont.woff') format('woff'), /* Pretty Modern       Browsers */
url('war-webfont-webfont.ttf')  format('truetype'), /* Safari, Android,     iOS */
url('war-webfont-webfont.svg') format('svg'); /* Legacy iOS */
}

我正在尝试通过检查器设置元素样式：

p {font-family: 'war';}

但什么也没发生。字体正在被识别（不是删除线），但字体不显示。

这是插入自定义字体的正确方法吗？

我也关注了Gantry Fonts Tutorial，但也没有成功。

Answer 1

为了让字体在 Gantry 框架上工作，我插入了 CSS：

@font-face {
    font-family: 'myfont';
    src: url('wp-content/themes/g5_hydrogen/custom/fonts/war-webfont-   webfont.eot'); /* IE9 Compat Modes */
    src: url('wp-content/themes/g5_hydrogen/custom/fonts/war-webfont-webfont.woff') format('woff'), /* Pretty Modern Browsers */
    url('wp-content/themes/g5_hydrogen/custom/fonts/war-webfont-webfont.ttf')  format('truetype'), /* Safari, Android, iOS */
    url('wp-content/themes/g5_hydrogen/custom/fonts/war-webfont-webfont.svg') format('svg'); /* Legacy iOS */
    }

然后我可以很容易地通过他们的名字来使用它们：

p {font-family: myfont;}

Answer 2

字体名称是你在font-family属性中写的，所以我认为应该是：

p {font-family: 'din';}