【问题标题】:Why would font names need quotes?为什么字体名称需要引号?
【发布时间】:2012-11-24 22:36:49
【问题描述】:

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

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

但在 Google 字体 (http://www.google.com/webfont) 上,我也看到了

font-family: 'Margarine', cursive;

有些人甚至这样使用它:

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

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

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

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

【问题讨论】:

标签: css fonts conventions


【解决方案1】:

当字体名称中有空格时,您必须使用引号。如果字体名称中没有空格,最好不要使用它们,尽管保留它们不会对文件大小造成任何影响。

例子:

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

【讨论】:

  • 这就是我的想法,但就像我说的那样,即使没有空间,我也到处都能看到它,如果我做“人造黄油”、“Helvetica”、宋体;或“人造黄油”,Helvetica,宋体;
  • 没有区别。 (我添加了一个希望对您有所帮助的示例。)
  • 我可能建议阅读 Stephan 作为对您原始问题的评论发布的文章。它在这个问题上更深入,而我只是做了一个快速的解释。链接以防他的评论消失:mathiasbynens.be/notes/unquoted-font-family
  • 解释你的反对票:它不像“字体名称中的空格”那么简单。您自己发布的链接解释说,情况并非如此,除非某些条件适用。因此,我建议您删除此错误答案或对其进行编辑以更好地符合您链接到的文章。
【解决方案2】:

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

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

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

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

【讨论】:

  • 这不是真的,您不需要为包含空格的字体名称加上引号。
  • 我没有意识到这一点,修改了我的答案以反映这一点。谢谢你。
  • 两年前的答案因为人们无法阅读而被否决>.
  • @Rick Calder。你说你修改了你的答案,但是第一行仍然是The quotes are only necessary to encapsulate names with spaces——这完全是错误的。任何浏览答案的人只会阅读您答案的开头,这是不正确的,所以不要想知道为什么您的答案会被否决。修改该行将有助于文章的整体质量。
  • 这就是为什么该行是斜体的原因,如果您阅读了该段的其余部分,则说明它们不是必需的。我不会为浏览它们的人创建答案,我创建它们是为了寻找完整的答案。
【解决方案3】:

您始终可以将特定字体系列名称放在双引号或单引号中,因此Arial"Arial"'Arial' 是等效的。只有 CSS 定义的通用字体系列名称(如 sans-serif)必须不带引号。

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

【讨论】:

  • 使用 IE,在添加引号之前,我无法正确获取 Bauhaus 93 字体。
  • @MGR 哪个版本的 IE?
  • @Crashalot 我正在使用 IE11。
【解决方案4】:

有两个原因;

  1. 当实际字体系列名称与通用系列名称共享相同名称时,以避免与具有相同名称的关键字混淆,例如

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

  1. 当字体系列名称中有多个单词时,例如

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

【讨论】:

  • 根据其他答案,#2似乎不是真的。也就是说,即使姓氏中有多个单词,也不需要引号。
【解决方案5】:

何时引用字体系列:

可选

font-family: Times New Roman;         /* These are equivalent */
font-family: 'Times New Roman';
font-family: "Times New Roman";

font-family: Unique Ode™ ? Épopée;   /* These are equivalent */
font-family: "Unique Ode™ ? Épopée";

font-family: "Answer #42"             /* These are equivalent */
font-family: "Answer \23 42";
font-family: Answer \23 42; 

只要字体名称只包含:

然后引号是可选的。单引号或双引号。忽略大小写。有一些奇怪的边缘情况:未引用的单词不能以数字、破折号或破折号开头。

必须

font-family: "Intro Rust 2"           /* Unquoted words must not start with numbers. */
font-family: "Serif";                 /* For your own Serif, not the generic serif. */
font-family: "Yin/Yang";              /* Quote or code most ASCII punctuation. */

应该

font-family: "Initial Seals JNL"      /* `initial` and `default` are reserved words. */
font-family: "Omar Serif"             /* Generic names might also be reserved words? */

不得

font-family: monospace;               /* Generic fonts must NOT be quoted. */
font-family: serif;
font-family: sans-serif;
font-family: cursive;
font-family: fantasy;

谢谢:

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2019-08-13
    • 1970-01-01
    • 2021-05-19
    • 2011-11-30
    • 1970-01-01
    • 2011-12-26
    • 2019-02-22
    相关资源
    最近更新 更多