CSS 为什么字体名称需要引号?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/13751412/
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-29 20:58:12  来源:igfitidea点击:

Why would font names need quotes?

cssfontsconventions

提问by Benn

As far as I know, one needs to use double or single quotes for fonts if they contain spaces, like:

据我所知,如果字体包含空格,则需要对字体使用双引号或单引号,例如:

font-family: "Times New Roman", Times; 
font-family: 'Times New Roman', Times;

But on Google Fonts (http://www.google.com/webfont), I also see

但是在 Google Fonts ( http://www.google.com/webfont) 上,我也看到

font-family: 'Margarine', cursive;

Some even use it like so:

有些人甚至像这样使用它:

font-family: 'Margarine', 'Helvetica', arial;

I find this weird, as the following works as well:

我觉得这很奇怪,因为以下也有效:

font-family: Arial, Helvetica, sans-serif;
font-family: Cambria, serif;

So what is the correct usage of quotes around font names in CSS?

那么 CSS 中字体名称周围引号的正确用法是什么?

回答by Jukka K. Korpela

You can always put a specific font family name in quotes, double or single, so Arial, "Arial", and 'Arial'are equivalent. Only the CSS-defined generic font family names like sans-serifmust be written without quotes.

您可以随时把一个特定的字体系列名称在引号,双或单,所以Arial"Arial"'Arial'是等价的。只有 CSS 定义的通用字体系列名称sans-serif必须不带引号。

Contrary to popular belief, a font name consisting of space-separated names such as Times New Romanneed not be quoted. However, the specrecommends“to quote font family names that contain white space, digits, or punctuation characters other than hyphens”

与流行的看法相反,Times New Roman不需要引用由空格分隔的名称组成的字体名称。但是,规范建议“引用包含空格、数字或除连字符以外的标点符号的字体系列名称”

回答by Rick Calder

I've just learned myself that the quotes aren't ever necessary but rather recommended. We all learn something new every day.

我刚刚了解到,引号不是必需的,而是推荐的。我们每天都在学习新东西。

The other place you see them is in css properties that require a url

您看到它们的另一个地方是在需要 url 的 css 属性中

background:url('hithere.jpg');
background:url(hithere.jpg);

Both those statements are going to work exactly the same. Same goes for the fonts, which type of quote you use is irrelevant in this case, just be consistent in how YOU do things and that is all that really matters.

这两个语句的工作原理完全相同。字体也是如此,在这种情况下,您使用哪种类型的引用无关紧要,只要在您做事的方式上保持一致,这才是真正重要的。

回答by bizworld

For two reasons;

有两个原因;

  1. When an actual font-family name shares the same name as a generic family name, to avoid confusion with keywords with the same names e.g.
  1. 当实际的字体系列名称与通用系列名称共享相同的名称时,以避免与具有相同名称的关键字混淆,例如

p {font-family: 'Shift', sans-serif;}

p {font-family: 'Shift', sans-serif;}

  1. When there are more than one word in a font-family name e.g.
  1. 当字体系列名称中有多个单词时,例如

p {font-family: 'Times New Roman', ..... , a generic family name here ;}

p {font-family: 'Times New Roman', ..... , a generic family name here ;}

回答by greg5green

You have to use quotes when there is a space in the font name. If there is no space in the font name, it's best practice to leave them off, although it won't hurt anything but your file size to have them still.

当字体名称中有空格时,您必须使用引号。如果字体名称中没有空格,最好将它们保留下来,尽管保留它们除了文件大小之外不会有任何伤害。

Examples:

例子:

font-family: "Times New Roman", Times; // ok, and best practice
font-family: Times New Roman, Times; // incorrect, Browser won't be able to find Times New Roman
font-family: "Times New Roman", "Times"; // ok, but has extraneous quotes around Times