我需要在 CSS 中的字体系列名称周围加上引号吗?

发布于 2024-12-08 04:45:16 字数 330 浏览 4 评论 0原文

我记得很久以前就听说过,在 CSS font-family 属性中包含多个单词的字体名称周围加上引号被认为是“最佳实践”,如下所示:

font-family: "Arial Narrow", Arial, Helvetica, sans-serif;

到底如何,我尝试从 “Arial Narrow” 和 Safari 和 Firefox 渲染它没有任何问题。

那么,这个经验法则有任何逻辑吗,还是只是一个神话?是否是旧版浏览器的问题不再适用于当前版本?我已经这样做了很长时间,以至于我从未停下来思考这是否真的有必要。

I remember hearing a long time ago that it was considered "best practice" to wrap quotes around font names that contain multiple words in the CSS font-family property, like this:

font-family: "Arial Narrow", Arial, Helvetica, sans-serif;

For the heck of it, I tried removing the quotes from "Arial Narrow" and Safari and Firefox don't have any problem rendering it.

So, is there any logic to this rule of thumb, or is it just a myth? Was it an issue with older browsers that no longer applies to the current versions? I've been doing this for so long that I never stopped to think if it was actually necessary.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

淡淡的优雅 2024-12-15 04:45:16

CSS 2.1 规范告诉我们:

字体系列名称必须以字符串形式加引号,或者不加引号
作为一个或多个标识符的序列。这意味着大多数标点符号
每个标记开头的字符和数字必须转义
不带引号的字体系列名称。

它接着说:

如果将标识符序列作为字体系列名称给出,则
计算值是通过连接所有名称转换为字符串的名称
序列中的标识符由单个空格组成。

为了避免转义错误,建议引用字体家族
包含空格、数字或标点符号的名称
除连字符之外:

所以是的,存在差异,但不太可能引起任何问题。就我个人而言,当字体名称包含空格时,我总是引用它们。在少数(可能非常罕见)情况下,绝对需要引号:

恰好与关键字值相同的字体系列名称
(“继承”、“衬线”、“无衬线”、“等宽字体”、“幻想”和
'cursive') 必须加引号以防止与关键字混淆
相同的名字。关键字“initial”和“default”保留用于
将来使用,并且在用作字体名称时也必须加引号。

另请注意标点符号,例如 / 或 !在标识符中可能还需要被引用或转义。

The CSS 2.1 spec tells us that:

Font family names must either be given quoted as strings, or unquoted
as a sequence of one or more identifiers. This means most punctuation
characters and digits at the start of each token must be escaped in
unquoted font family names.

It goes on to say:

If a sequence of identifiers is given as a font family name, the
computed value is the name converted to a string by joining all the
identifiers in the sequence by single spaces.

To avoid mistakes in escaping, it is recommended to quote font family
names that contain white space, digits, or punctuation characters
other than hyphens:

So yes, there is a difference, but one that's unlikely to cause any problems. Personally, I have always quoted font names when they contain spaces. In a few (presumably very rare) cases, the quotes are absolutely required:

Font family names that happen to be the same as a keyword value
('inherit', 'serif', 'sans-serif', 'monospace', 'fantasy', and
'cursive') must be quoted to prevent confusion with the keywords with
the same names. The keywords 'initial' and 'default' are reserved for
future use and must also be quoted when used as font names.

Also note that punctuation such as / or ! within an identifier may also need to be quoted or escaped.

一张白纸 2024-12-15 04:45:16

根据 CSS 字体模块级别 3 规范 2013 年 10 月,“除通用系列之外的字体系列名称必须作为字符串加引号,或者作为一个或多个标识符的序列不加引号”。 因此您不需要将它们括在引号中。

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

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

According to the CSS Fonts Module Level 3 spec of October 2013, "font family names other than generic families must either be given quoted as strings, or unquoted as a sequence of one or more identifiers". So you DO NOT need to enclose them in quotes.

However, if you don't "most punctuation characters and digits at the start of each token must be escaped". To avoid escaping mistakes, the W3C actually recommends to quote font family names containing white space, digits, punctuation or keyword values (‘inherit’, ‘serif’, etc.).

The generic font family names (‘serif’, ‘sans-serif’, ‘cursive’, ‘fantasy’, and ‘monospace’) MUST NOT be quoted as they are actually keywords.

一紙繁鸢 2024-12-15 04:45:16

如果样式是内联的,例如 some texte,则它可以工作。

但是,如果警察字体的名称包含一些特殊字符,或者以数字开头包含引号或其他奇怪的东西(例如“01 Digitall”或“a_CityNovaTitulB&WLt”或“Bailey'sCar”),则必须使用特殊的字体" 语法可以应用于各种奇怪的字体名称:

<font style="font-family:"a_CityNovaTitulB&WLt" , "Bailey'sCar"">some text</font>

在 FireFox 中,源代码将显示" 如下: "

如果没有这个技巧, this:

<font style="font-family:a_CityNovaTitulB&WLt ,Bailey'sCar">some text</font>

不会自动在每个浏览器中工作。
对于以数字开头的字体名称非常有用,例如“8 Pin”。

If style is inline, like <font style="font-family:Arial Narrow">some texte</font>, it works.

But if the name of the police font contains some special characters, or starts with a number contains a quotes or others strange things (like "01 Digitall" or "a_CityNovaTitulB&WLt" or "Bailey'sCar"), you must use a special syntax with " which can be applied to all kinds of stranges fonts names:

<font style="font-family:"a_CityNovaTitulB&WLt" , "Bailey'sCar"">some text</font>

In FireFox,the source will show the " as this: "

without this trick, this:

<font style="font-family:a_CityNovaTitulB&WLt ,Bailey'sCar">some text</font>

doesn't automatically work in every browser.
It's useful for font name witch start by a number to, like "8 Pin".

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文