CSS url（）函数中<url-modifier>的示例用法是什么？

Question

3.4. Resource Locators: the <url> type在

中描述<url-modifier>

  

网址 是指向资源的指针，是一种功能表示法   由<url>表示。 <url>的语法是：

     

<url> = url( <string> <url-modifier>* )

     

除了上面定义的语法之外，有时也可以   用其他方式写的：

     

  

• 由于遗留原因，可以在URL本身周围编写<url>而不带引号。此语法经过特殊解析，并且   在句法上产生<url-token>而不是函数。   [CSS3SYN]

  

• 某些CSS上下文（例如@import）允许<url>代替<string>。这与行为完全相同   编写包含该字符串的url()函数。因为这些   编写<url>的其他方式不是功能符号，它们   不接受任何<url-modifier> s。

  

     

注意：旧版引号的特殊解析规则   <url>语法表示括号，空白字符，单个   必须转义出现在URL中的引号（'）和双引号（“）   用反斜杠，例如url(open\(parens)，url(close\)parens)。   根据URL的类型，也可以编写这些   字符作为URL转义（例如url(open%28parens)或   url(close%29parens)中描述的{url()}。 （如果写成   包含字符串的普通函数，普通字符串转义规则   应用;只有换行符和用于引用字符串的字符需要   被逃脱。）

在

  

URL

     

<url-modifier>函数支持指定其他<url-modifier> s，   以某种方式改变URL的含义或解释。一个   <url-modifier>可以是3.4.2. URL Modifiers或<ident>。

     

此规范未定义任何<ident>，而是其他   规格可能会这样做。

另见function

• function的{​​{1}}和url()的示例用法是什么？

• <string>之间的<ident>，function，url()有何区别？

Answer 1

  

<url-modifier>是<ident>或function。

<ident>是一个标识符。

  

CSS源的一部分，其语法与<ident-token>相同。

<ident-token> Syntax ;

我找不到<ident>函数中使用的url的任何示例，但是 如this email中所述，未来有一些可能的用途。

• 获取控制CORS / cookies / etc的选项
• 使用Subresource Integrity

查看<ident>语法，您不能使用键/值对，所以我假设 其中大部分将使用尚不存在的function来实现。资源提示可以使用<ident>来实现。

.foo { background-image: url("//aa.com/img.svg" prefetch); }

然而，我确实找到了一个有趣的想法集合＃34;已定义function <url-modifier>。

SVG Parameters（非官方规范）

params() function是<url-modifier>

.foo { background-image: url("//aa.com/img.svg" param(--color var(--primary-color))); }