-1

不知道我做错了什么，但是按照本教程http://sixrevisions.com/css/font-face-guide/我在让它工作时遇到了问题。

我在 style.css 顶部的代码：

@font-face {
    font-family: 'chunkfiveregular';
    src: url('http://careerteam.de/wp-content/themes/theme1383/css/chunkfive-webfont.eot');
    src: url('http://careerteam.de/wp-content/themes/theme1383/css/chunkfive-webfont.eot?#iefix') format('embedded-opentype'),
         url('http://careerteam.de/wp-content/themes/theme1383/css/chunkfive-webfont.woff') format('woff'),
         url('http://careerteam.de/wp-content/themes/theme1383/css/chunkfive-webfont.ttf') format('truetype'),
         url('http://careerteam.de/wp-content/themes/theme1383/css/chunkfive-webfont.svg#chunkfiveregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

我的根文件夹中有所有文件。

我后来通过以下方式调用字体系列：

#man_translated {
    font-size: 26px;
    font-style: italic;
    line-height: 28px;
    font-family:chunkfiveregular;
}

我在 wordpress 中，我使用的模板具有 h1、h2、h3 的预设字体画布样式，将每个单词转换为字体 dakota 手写的 png。也许模板中的这个核心设置与我即时更改 javascript id/css 冲突。

4

7 回答 7

4

您的 css 正在工作，但也许 WordPress 正在覆盖它。!important尝试在字体名称旁边放置。

例子：

#man_translated {
    font-size: 26px;
    font-style: italic;
    line-height: 28px;
    font-family: chunkfiveregular !important;
}

或者您也可以使用相对链接。而不是 put http://careerteam.de/wp-content/themes/theme1383/css/chunkfive-webfont.eot，摆脱http://careerteam.de/并使它像这样：

url('wp-content/themes/theme1383/css/chunkfive-webfont.eot');

小提琴

于 2013-09-18T03:59:51.520 回答
1

清单：

  • 您的 FontFace 声明位于样式表的最顶部。
  • 所有字体文件都上传到服务器并在正确的位置？您的代码假定字体将上传到与样式表相同的目录中。
  • 您正在添加font-family: 'ChunkFiveRegular;到要使用 ChunkFive 字体的每个元素。
于 2013-09-12T15:19:45.473 回答
0

您需要在此处正确使用单引号 ( ' )：

font-family: 'ChunkFiveRegular';

并在这里（也不是调用.p类，而是调用p元素：

p {font-family:'ChunkFiveRegular';}
于 2013-09-12T14:27:21.750 回答
0

在您的实际站点上，仅加载以下样式表：
http://www.careerteam.de/wp-content/themes/theme1383/css/normalize.css
http://www.careerteam.de/wp-content/themes/ theme1383/style.css
http://www.careerteam.de/wp-content/themes/theme1383/css/prettyPhoto.css
http://www.careerteam.de/wp-content/themes/theme1383/css/grid。 css
http://www.careerteam.de/wp-content/plugins/contact-form-7/styles.css?ver=3.1.1

我在 style.css 顶部的代码

不包含@font-face {...}！

所以可能你使用的是“错误的”CSS文件......？
还是缓存版本没有更新？

于 2013-09-16T08:29:30.720 回答
0

您可能可以通过删除除 truetype 之外的所有 @font-face 声明来开始简化您的问题，因为所有主流浏览器在其当前版本中都支持此模式：http:
//caniuse.com/ttf

然后您应该检查您的服务器导出的 MIME 类型是否正确

然后，您应该尝试确保始终以相同的方式编写字体名称（带或不带引号）

于 2013-09-17T12:59:21.463 回答
0

路径绝对是错误的。它需要此引用样式表所在文件夹的路径。首先，在您的 css 文件夹中创建一个字体文件夹，将字体文件放在那里并执行此操作；

@font-face {
font-family: 'chunkfiveregular';
src: url('fonts/chunkfive-webfont.eot');
src: url('fonts/chunkfive-webfont.eot?#iefix') format('embedded-opentype'),
     url('fonts/chunkfive-webfont.woff') format('woff'),
     url('fonts/chunkfive-webfont.ttf') format('truetype'),
     url('fonts/chunkfive-webfont.svg#chunkfiveregular') format('svg');
font-weight: normal;
font-style: normal;
于 2013-09-17T19:14:59.173 回答
0

您需要选择是否要使用@font-face 或cufon。@font-face 代码片段应该在你的 style.css 中，你的字体在它们自己的文件夹中。

例子：

您的主题文件夹
- /css
- /字体
- 主题文件

您不需要在样式表的 @font-face 中包含字体的完整 URL。

    @字体脸{
    字体系列：'chunkfiveregular'；
    src: url('font/chunkfive-webfont.eot');
    src: url('font/chunkfive-webfont.eot?#iefix') 格式('embedded-opentype'),
             url('font/chunkfive-webfont.woff') 格式('woff'),
             url('font/chunkfive-webfont.ttf') 格式('truetype'),
             url('font/chunkfive-webfont.svg#chunkfiveregular') 格式('svg');
    字体粗细：正常；
    字体样式：正常；
}

您必须将字体名称放在您想要的设计元素中。这需要查看您的样式表。在某些情况下，如果您尝试更改字体的确切元素不存在，请检查您的页面源并写入元素。有些主题可能看起来像是在一起的，但是很多人忘记了 WordPress 在放入页面 ID、帖子 ID、小部件时生成的标记，而使用 HTML5，您正在处理更多的标签，如文章、部分，甚至放在一边.

于 2013-09-18T06:42:46.557 回答