css - 无法集中精力访问服务器上的字体(在控制台中出现 404 错误)

Question

所以我下载了一种名为“Alef”的新字体。它是希伯来语的，但这无关紧要，因为我无法激活它。我很确定我正在做一些非常愚蠢的事情，但我已经尝试了几个小时来应用它但无济于事。

我得到的:

8 个文件:

4 x 普通 eot、svg、ttf、woff

4 x bold eot, svg, ttf, woff

还有一个名为 stylesheet.css 的样式表文件，现在包含以下代码:

@font-face {
font-family: 'Alef';
src: url("/wp-content/themes/duet/Alef-bold.eot");
src: url("/wp-content/themes/duet/Alef-bold.eot?#iefix") format('embedded-opentype'),
     url("/wp-content/themes/duet/Alef-bold.woff") format('woff'),
     url("/wp-content/themes/duet/Alef-bold.ttf") format('truetype'),
     url("/wp-content/themes/duet/Alef-bold.svg#alefbold") format('svg');
font-weight: bold;
font-style: normal;

}
@font-face {
font-family: 'Alef';
src: url("/wp-content/themes/duet/Alef-regular.eot");
src: url("/wp-content/themes/duet/Alef-regular.eot?#iefix") format('embedded-opentype'),
     url("/wp-content/themes/duet/Alef-regular.woff") format('woff'),
     url("/wp-content/themes/duet/Alef-regular.ttf") format('truetype'),
     url("/wp-content/themes/duet/Alef-regular.svg#alefregular") format('svg');
    font-weight: normal;
    font-style: normal;

我已经将所有文件上传到我的主题目录:/wp-content/themes/duet/

我的主要 CSS 文件名为 style.css，它也在同一目录中，我将此代码添加到文件中:

@font-face{
font-family: 'Alef';
src: url('Alef.eot');
src: url('Alef.eot?#iefix')
   format('embedded-opentype'),
   url('Alef.woff') format('woff'),
   url('Alef.ttf') format('truetype'),
   url('Alef.svg#webfont') format('svg');
}

然后我所做的就是将这一行添加到我的 header.php 中:

        <link rel="stylesheet" href="/wp-content/themes/duet/stylesheet.css" type="text/css" charset="utf-8" />

当然我设置了我的 p {font-family: Alef;)

我做错了什么？我在 Chrome 的控制台中收到文件的 404 错误。不过，它会在错误控制台的右侧显示正确的 URL。

Answer 1

我几乎痴迷地使用这个工具。像这个一样，节省了我解决错误的时间。

http://www.fontsquirrel.com/tools/webfont-generator

有史以来最好的工具。