CSS字体“Helvetica Neue”

时间:2011-11-14 07:57:34

标签: css fonts

我经常看到使用字体“Helvetica Neue”的网站。这种字体是否安全使用,例如。宋体?或者浏览器在渲染时遇到问题,或者很多机器都没有这种字体?感谢。

5 个答案:

答案 0 :(得分:65)

这是Mac上的默认字体,但在PC上很少见。由于它在技术上不是网络安全的,有些人可能拥有它,有些人可能没有。如果你想使用这样的字体,而不使用@ font-face,你可能想用几种不同的方式写出来,因为它可能对每个人都不一样。

我喜欢使用触及所有基础的字体堆栈:

font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", 
  Helvetica, Arial, "Lucida Grande", sans-serif;

此推荐的font-family堆栈在此CSS-Tricks代码段Better Helvetica中进一步描述,该代码段也使用font-weight: 300;

答案 1 :(得分:31)

此字体并非所有设备上的标准字体。它默认安装在某些Mac上,但很少安装在PC和移动设备上。

要在所有设备上使用此字体,如果您希望使用该字体,请使用CSS中的@font-face declaration链接到您的域名。

@font-face { font-family: Delicious; src: url('Delicious-Roman.otf'); } 
@font-face { font-family: Delicious; font-weight: bold; src: url('Delicious-Bold.otf'); }

取自css3.info

答案 2 :(得分:16)

Helvetica Neue是付费字体,因此您不应该@ font-face,因为您可以自由分发受版权保护的字体。它包含在Mac系统中但不包含在windows / linux中,所以是的,很多用户都没有安装它。无论如何,您可以使用'Arial Narrow'作为Windows替代品,这是它的窗口等效。

答案 3 :(得分:3)

您可以使用http://www.fontsquirrel.com/fontface/generator对网站的任何字体进行编码。它将生成包含字体的代码。

我并不真的将它用于30px以上的字体。它们作为图像看起来更好(因为图像是消除锯齿的,有些浏览器不会在浏览器中对字体进行反锯齿)。

请参阅:http://www.truetype-typography.com/ttalias.htm

希望有帮助...

答案 4 :(得分:1)

大多数Windows用户的计算机上都没有该字体。此外,您不能只是将它提交到您的服务器并使用font-face调用它,因为这不是一个免费的字体......

最后,但并非最不重要的是,回答没人提到的问题,Helvetica和Helvetica Neue在屏幕上表现不佳,除非他们有一个非常大的font-size。你可以找到很多使用这种字体的页面,在所有这些页面中,你会看到一行文字的顶部边框看起来很波浪,而且有些字母看起来比其他字母高。在我看来,这是你不应该使用它的主要原因。您可以使用其他选项,例如Open Sans。