引用url()的值真的有必要吗?
我应该在样式表中使用以下哪一个?
/* Example #1: */ background-image: url(image.png); /* Example #2: */ background-image: url("image.png"); /* Example #3: */ background-image: url('image.png');
W3C指定什么是正确的方法 ?
W3C表示引用是可选的,所有的三种方法都是合法的。
开始和结束报价只需要是相同的字符。
如果您的网址中包含特殊字符,则应使用引号或转义字符(请参阅下文)。
语法和基本数据类型
URI值的格式是'url('后跟可选的空格,后跟可选的单引号(')或双引号(“)字符,后跟URI本身,后跟可选的单引号(')或双引号(“)字符,后跟可选空格,然后是”)“。 两个引号字符必须相同。
转义特殊字符:
出现在未加引号的URI中的某些字符(例如括号,空白字符,单引号(')和双引号(“))必须使用反斜线进行转义,以便生成的URI值为URI标记:'\(', '\')。
更好地使用引号是因为它是由最新标准推荐的,边缘情况较少。
根据最新的CSS值和模块级别3的编辑草案(2015年12月18日)
URL是指向资源的指针,是由
<url>
表示的功能符号。<url>
的语法是:
<url> = url( <string> <url-modifier>* )
没有加引号的版本只支持传统的原因 ,需要特殊的解析规则(对于转义序列等),因此是麻烦的,不支持URL修饰符。
这意味着, url(...)
语法应该是一个函数表示法,它将一个字符串和一个url-modifier作为参数。 使用引号符号(产生一个字符串标记)将更加符合标准,并且引入更少的复杂性。
@ SimonMourier在最上面的答案中的评论是错误的,因为他查找了错误的规范。 url-token
类型只是针对传统的特殊分析规则而引入的,所以这就是为什么它与引号没有任何关系。
这是什么W3Css2.1规范说:
URI值的格式是'url('后跟可选的空格,后跟可选的单引号(')或双引号(“)字符,后跟URI本身,后跟可选的单引号(')或双引号(“)字符,后跟可选空格,然后是”)“。 两个引号字符必须相同。
资料来源: http : //www.w3.org/TR/CSS21/syndata.html#uri
所以你提出的3个例子都是正确的,但是我会选择第一个例子,因为你使用的字符少了,所以CSS文件会变小,导致带宽使用量减少。
这可能觉得这并不重要,但高流量的网站更喜欢节省带宽和大量的CSS文件,并在其中的URL引用是有意义的,选择使文件更小的选项…即使因为没有优势不这样做 。
注意:如果网址包含圆括号,逗号,空白字符,单引号或双引号,则可能必须转义字符。 这可能会使网址比只使用引号(这需要更少的转义)更长。 因此,你可能想要提供一个带有不带引号的URL的Css文件,只有当转义的开销不会使得URL长于使用引号(这是非常罕见的)时。
然而,我不希望任何人甚至考虑这些边缘情况…一个Css优化器会为你处理…(但是,如果你实际上正在编写一个css优化器,你肯定需要知道所有这些:P)
根据W3C,有三种方法是合法的。 如果名字中有特殊字符(如空格),则应使用第二个或第三个字符。
例2或3是最好的:
从W3C开始: URI值的格式是'url('后跟可选的空格,然后是可选的单引号(')或双引号(“)字符,后跟URI本身,后跟可选的单引号(')或双引号(“)字符,然后是可选空格,然后是”)“。 两个引号字符必须相同。
请注意,从相同的解释,例1是可以接受的,如果适当的字符逃脱。
根据Google CSS编码风格
不要在URI值(url())中使用引号。
例外:如果您确实需要使用@charset规则,请使用双引号 – 不允许使用单引号。
我有:
a.pic{ background-image: url(images/img (1).jpg); }
我花了一段时间才明白,文件名关闭大括号是违反规则。
所以这不是强制性的,但即使旧版浏览器不太了解引用,也可以在相当复杂的动态生成页面中为您节省一些麻烦。