css - 字体系列不适用于字体

Question

http://www.chooseyourtelescope.com/

页面中间的大“C”和 H1('Choose The Right...)应使用“Pirulen”字体系列书写。

我首先尝试了“经典”@font-face 方法，然后使用 WEBFONT GENERATOR 并添加在 MyFonts 文件夹中创建的所有文件的高级方法。

CSS

@font-face {
    font-family: 'pirulenregular';
    src: url('/www/wp-content/themes/virtue - child/MyFonts/pirulen_rg-webfont.eot');
    src: url('/www/wp-content/themes/virtue - child/MyFonts/pirulen_rg-webfont.eot?#iefix') format('embedded-opentype'),
         url('/www/wp-content/themes/virtue - child/MyFonts/pirulen_rg-webfont.woff2') format('woff2'),
         url('/www/wp-content/themes/virtue - child/MyFonts/pirulen_rg-webfont.woff') format('woff'),
         url('/www/wp-content/themes/virtue - child/MyFonts/pirulen_rg-webfont.ttf') format('truetype'),
         url('/www/wp-content/themes/virtue - child/MyFonts/pirulen_rg-webfont.svg#pirulenregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

但是还是不行

Answer 1

您的url 需要是一个网址，而不是文件路径。您通常将其设置为相对于 css 文件的位置，因此它将是:

@font-face {
    font-family: 'pirulenregular';
    src: url('MyFonts/pirulen_rg-webfont.eot');
    src: url('MyFonts/pirulen_rg-webfont.eot?#iefix') format('embedded-opentype'),
     url('MyFonts/pirulen_rg-webfont.woff2') format('woff2'),
     url('MyFonts/pirulen_rg-webfont.woff') format('woff'),
     url('MyFonts/pirulen_rg-webfont.ttf') format('truetype'),
     url('MyFonts/pirulen_rg-webfont.svg#pirulenregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

下一个问题是，在页面上您将字体系列指定为“pirulen”，但在 CSS 中它是“pirulenregular”，这些必须匹配，所以选择一个。