Question

我目前正在用HTML5编写一个网页，试图将Avenir Black作为一个文本块的字体。但是，似乎每次我将其定义为字体系列时，它都不起作用，而是显示默认字体。现在我并不想修改CSS文件，因为它只针对一个文本块...问题是什么？

提前致谢！

<!DOCTYPE html>
<html>
    <head>

    </head>

    <body>
    <p style="font-family : Avenir Black ; font-size : 54pt"> SAMPLE </p>

    </body>
</html>

显示http://imgur.com/QlUaXTd。

Answer 1

带有空格的字体系列名称需要撇号，如Evan Mosseri所说，所以： <p style="font-family : 'Avenir Black' ; font-size : 54pt"> SAMPLE </p> 但是，该字体也必须安装在运行浏览器的计算机上，这对于一般的浏览器来说似乎不太可能，即使它安装在您的计算机上也是如此。

你可以1）放弃并使用像Arial Black这样的东西，或2）使用图像，或3）找到并购买可下载的Avenir Black字体。对于后者，尝试搜索“Avenir Black WOFF”。键入图像是一个坏主意™，最好单独出于多种原因，其中最重要的是可访问性。

这次不会提供完整的解决方案，但只要CSS不起作用，CSS Validator就是你的朋友：http://jigsaw.w3.org/css-validator/

编辑添加：您应该始终在font-family中使用替代列表，以其中一个通用字体名称结尾。所以，在你的情况下： font-family: 'Avenir Black', 'Arial Black', sans-serif; 这样，如果在运行浏览器的计算机上安装了Avenir Black，它将被使用。如果没有，将使用Arial Black。如果两者都不可用，您将获得一些 sans-serif字体而不是默认字体。

Google搜索“与Avenir Black类似的字体”会显示Google字体Nunito：http://www.google.com/fonts/specimen/Nunito它是免费的，或者您可以以30美元的价格获得真正的Avenir Black。

Answer 2

尝试使用font-family：“Avenir Black”，但您可能需要字体声明

如何在HTML5中获得Avenir Black作为字体系列？

2 个答案: