5

我不明白如何让它工作,任何帮助将不胜感激;

我要离开我从这个网站得到的东西:http: //alistapart.com/article/cssatten

来自我的 style.css

@font-face {
 font-family: "JSL";
 src: url(http://ff.static.1001fonts.net/j/s/jsl-ancient.normal.ttf) format("truetype");
}

font {
 color: #000000;
 font-size: 120%;
 font-family: "JSL";
}
4

5 回答 5

6

加号也不是问题(使用我重命名的字体测试),您也不必在主 css 文件的顶部导入单独的 css 文件。

但是,您可能需要拥有更多版本的字体,而不仅仅是真正的类型。看看Bulletproof @font-face 语法

您可以使用FontSquirrel 的生成器来实现这一点。

这是我的应用程序中嵌入的示例@font-face,它固定在我的主 css 样式表的顶部。

@font-face {
    font-family: 'JustVector';
    src: url('../fonts/justvectorv2+webfont.eot');
    src: url('../fonts/justvectorv2+webfont.eot?') format('eot'),
        url('../fonts/justvectorv2+webfont.woff') format('woff'),
        url('../fonts/justvectorv2+webfont.ttf') format('truetype'),
        url('../fonts/justvectorv2+webfont.svg#webfontkw9J4lGf') format('svg');
    font-weight: normal;
    font-style: normal;
}
于 2013-02-18T20:35:56.813 回答
0

@font-face

尝试导入它:

@import_your_new_cssfile.css

你放哪里:

font-face {
 font-family: "JSL";
 src: url(http://www.fontyukle.net/en/DownLoad-JSL+Ancient.ttf) format("truetype");
}

font {
 color: #000000;
 font-size: 120%;
 font-family: "JSL";
}
于 2013-02-18T20:17:32.260 回答
0

字体 URL 中的“+”号可能有问题吗?您可能希望对其进行 URL 编码。

编辑 - 在点击字体 URL 后,看起来您应该尝试下载 ttf 文件,并在本地引用它,而不是从远程源引用。它提示我输入验证码以下载文件,这可能是它不起作用的原因。

于 2013-02-18T20:18:38.350 回答
0

您确实需要下载文件并在本地引用它,支持的链接有一个下载链接,需要下载验证码,这意味着它不是 TTF 文件的直接链接。

于 2013-02-18T20:33:41.800 回答
0

根据您可能需要使用的字体:

@font-face {
font-family: 'someFont';
src: url('path/to/font/someFont.eot');
src: url('path/to/font/someFont.eot?#iefix'), format('embedded-opentype'), 
     url('path/to/font/someFont.woff'), format('woff'), 
     url('path/to/font/someFont.ttf'), format('truetype'), 
     url('path/to/font/someFont.svg'), format('svg');
font-weight: normal;
font-style: normal;
}

在 CSS 中:

BODY 
{
    font-family: 'someFont', Fallback, sans-serif;
    font-size: 12px;
    ... 
}

当我遇到嵌入自定义字体的问题时,这对我有用。

于 2015-01-30T12:35:36.623 回答