CSS 字体“Helvetica Neue”

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/8118741/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-30 02:09:49  来源:igfitidea点击:

CSS Font "Helvetica Neue"

cssfonts

提问by Billa

I often see the websites using font "Helvetica Neue". Is this font safe to use, like eg. Arial? Or do the browsers have trouble rendering it or not many machines have this font? Thanks.

我经常看到使用字体“Helvetica Neue”的网站。这种字体是否可以安全使用,例如。汉字?或者浏览器在渲染它时有问题还是没有多少机器有这种字体?谢谢。

采纳答案by Kyle

This font is not standard on all devices. It is installed by default on some Macs, but rarely on PCs and mobile devices.

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

To use this font on all devices, use a @font-face declarationin your CSS to link to it on your domain if you wish to use it.

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

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

Taken from css3.info

取自css3.info

回答by Syren

It's a default font on Macs, but rare on PCs. Since it's not technically web-safe, some people may have it and some people may not. If you want to use a font like that, without using @font-face, you may want to write it out several different ways because it might not work the same for everyone.

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

I like using a font stack that touches on all bases like this:

我喜欢使用涉及所有基础的字体堆栈,如下所示:

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

This recommended font-family stack is further described in this CSS-Tricks snippet Better Helveticawhich uses a font-weight: 300;as well.

这个推荐的字体系列堆栈在这个 CSS-Tricks 片段Better Helvetica 中有进一步的描述,它也使用了font-weight: 300;

回答by scumah

Helvetica Neue is a paid font, so you shouldn't @font-face it, as you'd be freely distributing a copyrighted font. It's included in Mac systems but not in windows/linux ones, so yes, plenty of your users wont have it installed. Anyway, you can use 'Arial Narrow' as a windows substitute, which is it's windows equivalent.

Helvetica Neue 是一种付费字体,所以你不应该@font-face 它,因为你会自由分发受版权保护的字体。它包含在 Mac 系统中,但不包含在 Windows/Linux 系统中,所以是的,很多用户不会安装它。无论如何,您可以使用“Arial Narrow”作为 Windows 替代品,它与 Windows 等效。

回答by Homer6

You can use http://www.fontsquirrel.com/fontface/generatorto encode any font for websites. It'll generate the code to include the font.

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

I don't really use it for fonts over 30px. They look much better as an image (because images are anti-aliased, and some browsers don't anti-alias fonts in the browser).

我真的不把它用于超过 30px 的字体。它们作为图像看起来要好得多(因为图像是抗锯齿的,并且某些浏览器在浏览器中没有抗锯齿字体)。

See: http://www.truetype-typography.com/ttalias.htm

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

Hope that helps...

希望有帮助...

回答by Vandervals

Most windows users won't have that font on their computers. Also, you can't just submit it to your server and call it using font-face because this isn't a free font...

大多数 Windows 用户在他们的计算机上不会有这种字体。此外,您不能将它提交到您的服务器并使用 font-face 调用它,因为这不是免费字体......

And last, but not least, answering the question that nobody mentioned yet, Helvetica and Helvetica Neue do not render well on screen unless they have a really big font-size. You'll find a lot of pages using this font, and in all of them you'll see that the top border of a line of text looks wavy and that some letters look taller than others. In my opinion this is the main reason why you shouldn't use it. There are other options for you to use, like Open Sans.

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