我以前做过这个,但还没有掌握它。我从 fontsquirrel.com 下载了一个字体工具包,并试图让我的自定义字体在我的网站上工作。我尝试了很多变体,包括在网上找到的“防弹”方法,现在我自己都搞糊涂了。有人可以看看下面的代码并向我展示如何使用@font-face 正确地让自定义字体在网站上工作吗?
我有一个名为fonts.css的样式表,位于名为css的文件夹中。这用于调用自定义字体。字体文件位于名为fonts的根文件夹中。
样式表字体的 css是:
@font-face {
font-family: 'BebasNeueRegular';
src: url('../fonts/bebasneue-webfont.woff') format('woff'),
url('../fonts/bebasneue-webfont.ttf') format('truetype'),
url('../fonts/bebasneue-webfont.webfontABYyK1dn') format('svg');
font-weight: normal;
font-style: normal;
用于布局等的其他样式表调用字体如下:
}
#merchandise h1 {
font-family: "Bebas Neue", Arial, Helvetica, sans-serif;
font-size: 33px;
font-weight: normal;
line-height: normal;
text-transform: uppercase;
letter-spacing: 1px;
}
有什么明显的吗?当然,它在我的机器上本地工作,因为我安装了字体。