在CSS中,我是否需要将字体系列名称用引号括起来?

107

我记得很久以前听说在CSS的font-family属性中,将包含多个单词的字体名称用引号括起来被认为是"最佳实践",就像这样:

font-family: "Arial Narrow", Arial, Helvetica, sans-serif;
为了好玩,我尝试从"Arial Narrow"中删除引号,Safari和Firefox没有任何问题渲染它。 那么,这个经验法则有任何逻辑依据,还是只是一个谣言?这是旧版本浏览器的问题,现在不再适用于当前版本吗?我一直这样做,从来没有停下来思考它是否真正必要。

我认为引用每个字体族都是一个好主意,除了通用的字体族。这样可以保持一致性。 - Micah Henning
3个回答

85

CSS 2.1规范告诉我们:

字体族名称必须用引号括起来作为字符串,或者作为一个或多个标识符序列而未引用。这意味着在未引用的字体族名称中,每个标记开头的大多数标点符号和数字都必须被转义。

它接着说:

如果将一系列标识符作为字体族名称,则计算值是通过单个空格拼接序列中所有标识符而转换为字符串的名称。

为避免转义错误,建议对包含空格、数字或连字符以外的标点符号的字体族名称加引号:

所以是的,有区别,但不太可能造成任何问题。就我个人而言,当字体名称包含空格时,我总是用引号引用字体名称。在少数(假设非常罕见)情况下,引号绝对是必需的:

与关键字值('inherit'、'serif'、'sans-serif'、'monospace'、'fantasy' 和 'cursive')相同的字体族名称必须加引号,以防止与同名关键字混淆。将来保留 'initial' 和 'default' 关键字用作字体名称时,也必须加引号。

还要注意,在标识符内部的标点符号(如 / 或 !)可能也需要加引号或转义。


7
initialdefault也是关键字(它们被保留以备将来使用)。请参阅《CSS中未加引号的字体族名称》(Unquoted font family names in CSS)一文。 - Mathias Bynens

26
根据2013年10月的CSS字体模块3级规范,"除了通用字体族之外的字体族名称必须被视为字符串加引号或一个或多个标识符序列而不加引号"。因此,您无需将它们括在引号中。

但是,如果您不这样做,"每个标记开头的大多数标点符号和数字都必须进行转义处理"。为避免转义错误,W3C实际上建议对包含空格、数字、标点符号或关键字值的字体系列名称加引号(如“inherit”、“serif”等)。

通用字体系列名称(“serif”、“sans-serif”、“cursive”、“fantasy”和“monospace”)不得加引号,因为它们实际上是关键字。


3
如果样式是内联的,比如<font style="font-family:Arial Narrow">some texte</font>,它可以工作。但是,如果字体名称包含一些特殊字符,或以数字开头,包含引号或其他奇怪的东西(如“01 Digitall”或“a_CityNovaTitulB&WLt”或“Bailey'sCar”),您必须使用一个特殊语法,其中包含&quot;,可以应用于所有类型的奇怪字体名称。
<font style="font-family:&quot;a_CityNovaTitulB&WLt&quot; , &quot;Bailey'sCar&quot;">some text</font>

在FireFox中,源代码会将&quot;显示为这个符号:" 如果不使用这个技巧,会显示以下内容:
<font style="font-family:a_CityNovaTitulB&WLt ,Bailey'sCar">some text</font>

在每个浏览器中都不能自动工作。

对于以数字开头的字体名称(如“8 Pin”)也很有用。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接