Question

我正在尝试在我的网页上使用dafont.com上安装的名为“Bebas Neue”的字体。我正在运行Ubuntu，我在字体查看器中打开了字体并成功安装。现在我尝试在我的CSS中引用这样的字体：

font-family: 'Bebas Neue', sans-serif;

然而，这仍然显示默认字体。我是正确引用它还是需要做更多才能使用这种字体？

Answer 1

使用@ font-face方法。 http://fontsquirrel.com有很多免费和免费的商业用途资源。您可以将字体上传到他们的生成器中，它会为您提供带有跨浏览器字体文件和说明的整洁工具包。

以下是一个例子：

@font-face {
    font-family: 'OpenSansLight';
    src: url('fonts/fonts/OpenSans-Light-webfont.eot');
    src: url('fonts/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/OpenSans-Light-webfont.woff') format('woff'),
         url('fonts/OpenSans-Light-webfont.ttf') format('truetype'),
         url('fonts/OpenSans-Light-webfont.svg#OpenSansLight') format('svg');
    font-weight: normal;
    font-style: normal;

}

然后在你要将其应用于

的任何元素上引用它

<style type="text/css">
div {
    font-family: OpenSansLight;
}
</style>


<div>
    This is OpenSansLight!
</div>

Answer 2

试

@font-face
{
font-family: myFirstFont;
src: url('Bebas Neue.ttf'),
     url('Bebas Neue.eot'); /* IE9 */
}

其中src是字体的路径。

将字体放入项目文件夹。

并使用如下，

div
{
    font-family: myFirstFont;
}

CSS：使用已安装的字体

2 个答案: