[css-values] More normative definition of url(). Should hopefully fix #1014

fantasai · fantasai · commit f7f942e9672b · 2017-03-30T18:44:20.000-04:00
diff --git a/css-values-3/Overview.bs b/css-values-3/Overview.bs
@@ -501,10 +501,11 @@ Quoted Strings: the <<string>> type</h3>
 <h3 id="urls">
 Resource Locators: the <<url>> type</h3>
 
-	A <dfn>URL</dfn> is a pointer to a resource
-	and is a <a>functional notation</a>
-	denoted by <<url>>.
-	The syntax of a <<url>> is:
+	The <dfn>url()</dfn> <a>functional notation</a>,
+	denoted by <<url>>,
+	represents a <dfn>URL</dfn>,
+	which is a pointer to a resource.
+	The typical syntax of a <<url>> is:
 
 	<pre class="prod"><dfn id="url-value">&lt;url></dfn> = url( <<string>> <<url-modifier>>* )</pre>
 
@@ -514,44 +515,42 @@ Resource Locators: the <<url>> type</h3>
 		<pre>body { background: url("http://www.example.com/pinkish.gif") }</pre>
 	</div>
 
-	In addition to the syntax defined above,
-	a <<url>> can sometimes be written in other ways:
-
-	* A <<url>> can be written without quotation marks around the URL itself.
-		(This syntax is <a lt="consume a url token" spec=css-syntax-3>specially-parsed</a>
-		as a <<url-token>>. [[!CSS3SYN]])
-
-		<div class="example">
-			For example, the following declarations are identical:
-			<pre>
-				background: url("http://www.example.com/pinkish.gif");
-				background: url(http://www.example.com/pinkish.gif);
-            </pre>
-		</div>
-
-	* Some CSS contexts (such as ''@import'') allow a <<url>> to be represented by a bare <<string>>,
-		without the ''url()'' wrapper.
-		In such cases the string behaves identically to a ''url()'' function containing that string.
-
-		<div class="example">
-			For example, the following statements are identical:
-			<pre>
-				@import url("base-theme.css");
-				@import "base-theme.css";
-			</pre>
-		</div>
-
-	Note: The special parsing rules for the legacy quotation-mark&ndash;less <<url>> syntax
-	means that parentheses, <a href="https://www.w3.org/TR/css-syntax/#whitespace">whitespace</a> characters,
+	A <<url>> may alternately be written without quotation marks around the URL itself,
+	in which case it is <a lt="consume a url token" spec=css-syntax-3>specially-parsed</a>
+	as a <<url-token>> [[!CSS3SYN]].
+
+	<div class="example">
+		For example, the following declarations are identical:
+		<pre>
+			background: url("http://www.example.com/pinkish.gif");
+			background: url(http://www.example.com/pinkish.gif);
+		</pre>
+	</div>
+
+	Note: This unquoted syntax is cannot accept a <<url-modifier>> argument
+	and has extra escaping requirements:
+	parentheses, <a href="https://www.w3.org/TR/css-syntax/#whitespace">whitespace</a> characters,
 	single quotes (&#39;) and double quotes (") appearing in a URL
 	must be escaped with a backslash,
 	e.g. ''url(open\(parens)'', ''url(close\)parens)''.
+	(In quoted <<string>> ''url()''s,
+	only newlines and the character used to quote the string need to be escaped.)
 	Depending on the type of URL,
 	it might also be possible to write these characters as URL-escapes
 	(e.g. ''url(open%28parens)'' or ''url(close%29parens)'')
 	as described in [[URL]].
-	Alternately, the URL can be quoted as a string,
-	in which case only newlines and the character used to quote the string need to be escaped.
+
+	Some CSS contexts (such as ''@import'') also allow a <<url>>
+	to be represented by a bare <<string>>, without the ''url()'' wrapper.
+	In such cases the string behaves identically to a ''url()'' function containing that string.
+
+	<div class="example">
+		For example, the following statements are identical:
+		<pre>
+			@import url("base-theme.css");
+			@import "base-theme.css";
+		</pre>
+	</div>
 
 <h4 id="relative-urls">
 Relative URLs</h4>
@@ -1393,7 +1392,7 @@ Images: the <<image>> type</h3>
 
 	The <dfn><<position>></dfn> value specifies the position of a object area (e.g. background image)
 	inside a positioning area (e.g. background positioning area).
-	It is interpreted as specified for 'background-position'. [[!CSS3-BACKGROUNDS]]
+	It is interpreted as specified for 'background-position'. [[!CSS3-BACKGROUND]]
 
 	<pre class=prod>
 		<<position>> = [
@@ -2089,8 +2088,10 @@ Changes</h2>
 		<li>Inlined the <<position>> definition and dropped the three-value syntaxes
 			to allow for unambiguous combination in complex grammars.
 			This effectively removes that syntax from 'object-position',
-			but allows <<position>> to be re-used e.g. in [[CSS-TRANSFORMS]] for 3D positions.
+			but allows <<position>> to be re-used e.g. in [[CSS-TRANSFORMS-1]] for 3D positions.
 			(See <a href="https://lists.w3.org/Archives/Public/www-style/2017Feb/0052.html">discussion</a>.)
+		<li>Clarified handling of font-relative units outside the context of an element.
+		<li>Clarified definition of ''url()'' to normatively accept unquoted syntax.
 	</ul>
 
 	Changes since the <a href="https://www.w3.org/TR/2015/CR-css-values-3-20150611/">11 June 2015 Candidate Recomendation</a> are:
diff --git a/css-values/Overview.bs b/css-values/Overview.bs
@@ -491,10 +491,11 @@ Quoted Strings: the <<string>> type</h3>
 <h3 id="urls">
 Resource Locators: the <<url>> type</h3>
 
-	A <dfn>URL</dfn> is a pointer to a resource
-	and is a <a>functional notation</a>
-	denoted by <<url>>.
-	The syntax of a <<url>> is:
+	The <dfn>url()</dfn> <a>functional notation</a>,
+	denoted by <<url>>,
+	represents a <dfn>URL</dfn>,
+	which is a pointer to a resource.
+	The typical syntax of a <<url>> is:
 
 	<pre class="prod"><dfn id="url-value">&lt;url></dfn> = url( <<string>> <<url-modifier>>* )</pre>
 
@@ -504,44 +505,42 @@ Resource Locators: the <<url>> type</h3>
 		<pre>body { background: url("http://www.example.com/pinkish.gif") }</pre>
 	</div>
 
-	In addition to the syntax defined above,
-	a <<url>> can sometimes be written in other ways:
-
-	* A <<url>> can be written without quotation marks around the URL itself.
-		(This syntax is <a lt="consume a url token" spec=css-syntax-3>specially-parsed</a>
-		as a <<url-token>>. [[!CSS3SYN]])
-
-		<div class="example">
-			For example, the following declarations are identical:
-			<pre>
-				background: url("http://www.example.com/pinkish.gif");
-				background: url(http://www.example.com/pinkish.gif);
-            </pre>
-		</div>
-
-	* Some CSS contexts (such as ''@import'') allow a <<url>> to be represented by a bare <<string>>,
-		without the ''url()'' wrapper.
-		In such cases the string behaves identically to a ''url()'' function containing that string.
-
-		<div class="example">
-			For example, the following statements are identical:
-			<pre>
-				@import url("base-theme.css");
-				@import "base-theme.css";
-			</pre>
-		</div>
-
-	Note: The special parsing rules for the legacy quotation-mark&ndash;less <<url>> syntax
-	means that parentheses, <a href="https://www.w3.org/TR/css-syntax/#whitespace">whitespace</a> characters,
+	A <<url>> may alternately be written without quotation marks around the URL itself,
+	in which case it is <a lt="consume a url token" spec=css-syntax-3>specially-parsed</a>
+	as a <<url-token>> [[!CSS3SYN]].
+
+	<div class="example">
+		For example, the following declarations are identical:
+		<pre>
+			background: url("http://www.example.com/pinkish.gif");
+			background: url(http://www.example.com/pinkish.gif);
+		</pre>
+	</div>
+
+	Note: This unquoted syntax is cannot accept a <<url-modifier>> argument
+	and has extra escaping requirements:
+	parentheses, <a href="https://www.w3.org/TR/css-syntax/#whitespace">whitespace</a> characters,
 	single quotes (&#39;) and double quotes (") appearing in a URL
 	must be escaped with a backslash,
 	e.g. ''url(open\(parens)'', ''url(close\)parens)''.
+	(In quoted <<string>> ''url()''s,
+	only newlines and the character used to quote the string need to be escaped.)
 	Depending on the type of URL,
 	it might also be possible to write these characters as URL-escapes
 	(e.g. ''url(open%28parens)'' or ''url(close%29parens)'')
 	as described in [[URL]].
-	Alternately, the URL can be quoted as a string,
-	in which case only newlines and the character used to quote the string need to be escaped.
+
+	Some CSS contexts (such as ''@import'') also allow a <<url>>
+	to be represented by a bare <<string>>, without the ''url()'' wrapper.
+	In such cases the string behaves identically to a ''url()'' function containing that string.
+
+	<div class="example">
+		For example, the following statements are identical:
+		<pre>
+			@import url("base-theme.css");
+			@import "base-theme.css";
+		</pre>
+	</div>
 
 <h4 id="relative-urls">
 Relative URLs</h4>
@@ -2370,7 +2369,7 @@ Changes</h2>
 	Changes since <a href="http://www.w3.org/TR/css-values-3/">Level 3</a>:
 
 	<ul>
-		<li>Added the ''vi'', ''vb'', ''ic'', ''lh'' and ''rlh'' units.
+		<li>Added the ''vi'', ''vb'', ''ic'', ''cap'', ''lh'' and ''rlh'' units.
 	</ul>
 
 <h2 class="no-num" id="sec-pri">
