Css 引用url（）的值真的有必要吗？

我应该在样式表中使用以下哪项

/* Example #1: */ background-image: url(image.png);
/* Example #2: */ background-image: url("image.png");
/* Example #3: */ background-image: url('image.png');

---

W3C规定的正确方式是什么？

根据W3C，有三种方式是合法的。如果名称中有特殊字符（如空格），则应使用第二个或第三个。

W3C说引号是可选的，所有三种方式都是合法的

开始和结束报价只需要是相同的字符

如果URL中有特殊字符，则应使用引号或转义字符（见下文）

URI值的格式为“url（”后跟可选空格，后跟可选单引号（'）或双引号（“）字符，后跟URI本身，后跟可选单引号（'）或双引号（“）字符，后跟可选空格，后跟'”）。两个引号字符必须相同

转义特殊字符：

出现在无引号URI中的某些字符，如括号、空白字符、单引号（'）和双引号（“），必须用反斜杠转义，以便生成的URI值是URI标记：“\（”，“\）”

---

示例2或3最好：

URI值的格式为“url（”后跟可选空格，后跟可选单引号（'）或双引号（“）字符，后跟URI本身，后跟可选单引号（'）或双引号（“）字符，后跟可选空格，后跟'）。两个引号字符必须相同

---

注：根据相同的解释，如果转义了适当的字符，示例1是可以接受的。

以下是W3 CSS 2.1规范所述：

URI值的格式为“url”（） 后跟可选的空白 后跟可选的单引号 （'）或双引号（“）字符 后跟URI本身，后跟 通过可选的单引号（'）或 双引号（“）字符后跟 可选空白，后跟“'）”。 两个引号字符必须是相同的 一样

资料来源：

因此，您提出的3个示例都是正确的，但我选择的是第一个，因为您使用的字符更少，因此生成的CSS文件将更小，从而减少带宽使用

这可能感觉不重要，但高流量网站更喜欢节省带宽和大量css文件，其中的url引用选择使文件更小的选项是有意义的。。。 即使是因为不这样做没有好处

注意：如果url包含括号、逗号、空白字符、单引号或双引号，则可能需要转义字符。这可能会使url比仅使用引号（转义需要更少）更长。因此，只有在转义的开销不会使url比使用引号长（这是非常罕见的）时，您才可能希望使用不带引号的url提供Css文件

但是，我不希望任何人会考虑这些边缘情况……CSS优化器会为你处理这个问题……（但是，你确实需要知道所有这一切，如果你实际上是在编写一个CSS优化器：P）

根据

不要在URI值（url（））中使用引号

例外情况：如果确实需要使用@charset规则，则不允许使用双引号和单引号

---

最好使用引号，因为它是由最新标准推荐的，而且边缘案例更少

根据最新编辑的

URL是指向资源的指针，是由

表示的函数表示法。

的语法是：

=url（*）

---

无引号版本仅因遗留原因而受支持，并且需要特殊的解析规则（用于转义序列等），因此很麻烦，不支持url修饰符

这意味着，

url（…）

语法应该是一种函数表示法，它将字符串和url修饰符作为参数。使用引号表示法（它生成字符串标记）将更符合标准，并引入更少的复杂性

@SimonMourier在顶部答案中的评论是错误的，因为他查找了错误的规范。

url标记

类型只针对遗留的特殊解析规则引入，因此它与引号没有任何关系。

我有：

a.pic{
    background-image: url(images/img (1).jpg);
}

我花了一段时间才明白文件名闭括号违反了规则

因此，它不是强制性的，但是，即使老浏览器对引用不是很了解，它也可以在相当复杂的动态生成页面中为您省去一些麻烦。

2021年的更新（大多数答案来自2015年及之前）

引号是可选的，但是某些字符（如果使用）需要转义

来自MDN：

一个url，它是指向要包含的web资源的相对或绝对地址或指针，或一个数据uri，可以选择使用单引号或双引号。如果url包含括号、空格或引号，则需要使用引号，除非这些字符被转义，或者如果地址包含0x7e以上的控制字符。双引号不能出现在除非转义，否则双引号和单引号中的r不能出现在单引号中。以下内容均有效且等效：

<css_property>: url("https://example.com/image.png")
<css_property>: url('https://example.com/image.png')
<css_property>: url(https://example.com/image.png)

：url（“https://example.com/image.png")
：url（'https://example.com/image.png')
：url(https://example.com/image.png)

如果选择编写不带引号的URL，请在URL的任何括号、空格字符、单引号（'）和双引号（“）之前使用反斜杠（）

资料来源：

---

一些较老的浏览器可能在引用URL（即IE Mac）方面存在问题。除了bic72所说的，一些较老的浏览器在遇到CSS中引用的URL时也会发出双重请求，首先请求“myfile.png”，然后是myfile.png，因此我避免使用usi