Html 在网站中使用 Helvetica Neue
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/12070055/
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
Using Helvetica Neue in a Website
提问by user1505209
Normally, I use "Helvetica Neue"
for the fonts in some websites although looking at other sites, I've seen some with "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue"
.
通常,我"Helvetica Neue"
在某些网站上使用字体,尽管在查看其他网站时,我看到一些带有"HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue"
.
Is there any reason to reference Helvetica Neue in this way? Or should I stick with the normal that I use?
是否有任何理由以这种方式引用 Helvetica Neue?或者我应该坚持我使用的正常吗?
采纳答案by Red Taz
They are taking a 'shotgun' approach to referencing the font. The browser will attempt to match each font name with any installed fonts on the user's machine (in the order they have been listed).
他们正在采用“霰弹枪”方法来引用字体。浏览器将尝试将每个字体名称与用户机器上安装的任何字体(按照它们列出的顺序)进行匹配。
In your example "HelveticaNeue-Light"
will be tried first, if this font variant is unavailable the browser will try "Helvetica Neue Light"
and finally "Helvetica Neue"
.
在您的示例中,"HelveticaNeue-Light"
将首先尝试,如果此字体变体不可用,浏览器将尝试"Helvetica Neue Light"
,最后"Helvetica Neue"
.
As far as I'm aware "Helvetica Neue"
isn't considered a 'web safe font', which means you won't be able to rely on it being installed for your entire user base. It is quite common to define "serif"
or "sans-serif"
as a final default position.
据我所知,"Helvetica Neue"
它不被视为“网络安全字体”,这意味着您将无法依赖为整个用户群安装它。定义"serif"
或"sans-serif"
作为最终默认位置是很常见的。
In order to use fonts which aren't 'web safe' you'll need to use a technique known as font embedding. Embedded fonts do not need to be installed on a user's computer, instead they are downloaded as part of the page. Be aware this increases the overall payload (just like an image does) and can have an impact on page load times.
为了使用不是“网络安全”的字体,您需要使用一种称为字体嵌入的技术。嵌入字体不需要安装在用户的计算机上,而是作为页面的一部分下载。请注意,这会增加整体负载(就像图像一样)并且可能会影响页面加载时间。
A great resource for free fonts with open-source licenses is Google Fonts. (You should still check individual licenses before using them.) Each font has a download link with instructions on how to embed them in your website.
具有开源许可的免费字体的一个很好的资源是Google Fonts。(在使用它们之前,您仍然应该检查各个许可证。)每种字体都有一个下载链接,其中包含有关如何将它们嵌入您的网站的说明。
回答by Billy Moat
I'd recommend this article on CSS Tricks by Chris Coyier entitled Better Helvetica:
我推荐这篇由 Chris Coyier 撰写的关于 CSS Tricks 的文章,题为 Better Helvetica:
http://css-tricks.com/snippets/css/better-helvetica/
http://css-tricks.com/snippets/css/better-helvetica/
He basically recommends the following declaration for covering all the bases:
他基本上建议以下声明来涵盖所有基础:
body {
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
font-weight: 300;
}
回答by Andrew Morris
Assuming you have referenced and correctly integrated your font to your site (presumably using an @font-face kit) it should be alright to just reference yours the way you do. Presumably it is like this so they have fall backs incase some browsers do not render the fonts correctly
假设您已经引用并正确地将您的字体集成到您的网站(大概使用@font-face 工具包),那么按照您的方式引用您的字体应该没问题。大概是这样的,所以他们有回退,以防某些浏览器无法正确呈现字体