4

我以前做过这个,但还没有掌握它。我从 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;
}

有什么明显的吗?当然,它在我的机器上本地工作,因为我安装了字体。

4

1 回答 1

9

#merchandise h1,font-family: "Bebas Neue"需要font-family: "BebasNeueRegular"

或者

@font-face,font-family: 'BebasNeueRegular'需要 font-family: 'Bebas Neue'

于 2011-01-28T17:09:06.790 回答