Add cycle() notation per <http://lists.w3.org/Archives/Public/www-style/2009Jan/0104.html>.

Author: fantasai

css3-values/Overview.html

@@ -273,7 +273,10 @@ <h2 class="no-num no-toc" id=contents>Table of contents</h2>
       class=css>min()</code>&rsquo; and &lsquo;<code
       class=css>max()</code>&rsquo; </a>
 
-     <li><a href="#attr"><span class=secno>9.2. </span> Attribute References:
+     <li><a href="#cycle"><span class=secno>9.2. </span> Cycling Values:
+      &lsquo;<code class=css>cycle()</code>&rsquo;</a>
+
+     <li><a href="#attr"><span class=secno>9.3. </span> Attribute References:
       &lsquo;<code class=css>attr()</code>&rsquo;</a>
     </ul>
 
@@ -1409,7 +1412,55 @@ <h3 id=calc><span class=secno>9.1. </span> Calculations: &lsquo;<a
      both auto and fixed layout tables may be treated as if &lsquo;<code
      class=property>auto</code>&rsquo; had been specified.
 
-    <h3 id=attr><span class=secno>9.2. </span> Attribute References:
+    <h3 id=cycle><span class=secno>9.2. </span> Cycling Values: &lsquo;<code
+     class=css>cycle()</code>&rsquo;</h3>
+
+    <p>The <dfn id=cycle0>&lsquo;<code class=css>cycle()</code>&rsquo;</dfn>
+     expression allows descendant elements to cycle over a list of values
+     instead of inheriting the same value. The syntax of the &lsquo;<code
+     class=css>cycle()</code>&rsquo; expression is:
+
+    <pre>cycle( &lt;value&gt;# )</pre>
+
+    <p>where <code>&lt;value&lt;</code> is a CSS value that is valid where
+     the expression is placed. If any of the values inside are not valid,
+     then the entire &lsquo;<code class=css>cycle()</code>&rsquo; expression
+     is invalid.
+
+    <p>The value returned by &lsquo;<code class=css>cycle()</code>&rsquo;
+     must be determined by comparing the inherited value <var>I</var> (the
+     computed value on the parent, or, for the root, the initial value) to
+     the computed values <var>C<sub>n</sub></var> returned by the
+     <var>n</var>-th argument to &lsquo;<code
+     class=css>cycle()</code>&rsquo;. For the earliest
+     <var>C<sub>n</sub></var> such that <var>C<sub>n</sub></var> ==
+     <var>I</var>, the value returned by cycle is <var>C<sub>n+1</sub></var>.
+     However, if this <var>C<sub>n</sub></var> is the last value, or if there
+     are no <var>C<sub>n</sub></var> that equal <var>I</var>, the computed
+     value of the first value is returned instead.
+
+    <pre class=example>
+  /* make em elements italic, but make them normal if they're inside
+     something that's italic */
+  em { font-style: cycle(italic, normal); }</pre>
+
+    <pre class=example>
+  /* cycle between markers for nested lists, so that the top level has
+     disk markers, but nested lists use circle, square, box, and then
+     (for the 5th list deep) repeat */
+  ul { list-style-type: disk; }
+  li > ul { list-style-type: cycle(disk, circle, square, box); }</pre>
+
+    <p>The &lsquo;<code class=css>cycle()</code>&rsquo; notation is not
+     allowed to be nested; nor may it contain &lsquo;<code
+     class=css>attr()</code>&rsquo;, &lsquo;<a href="#calc0"><code
+     class=css>calc()</code></a>&rsquo;, &lsquo;<a href="#min"><code
+     class=css>min()</code></a>&rsquo;, or &lsquo;<a href="#max"><code
+     class=css>max()</code></a>&rsquo; notations. Declarations containing
+     such constructs are invalid and must be <a
+     href="http://www.w3.org/TR/CSS21/conform.html#ignore">ignored</a>.
+
+    <h3 id=attr><span class=secno>9.3. </span> Attribute References:
      &lsquo;<code class=css>attr()</code>&rsquo;</h3>
 
     <p class=issue>Describe the feature fully here, not just a delta from CSS
@@ -2085,6 +2136,9 @@ <h2 class=no-num id=index>Index</h2>
      <li>computed value, <a href="#computed-value" title="computed
       value"><strong>10.2.</strong></a>
 
+     <li>&lsquo;<code class=css>cycle()</code>&rsquo;, <a href="#cycle0"
+      title="''cycle()''"><strong>9.2.</strong></a>
+
      <li>deg, <a href="#deg" title=deg><strong>6.1.</strong></a>
 
      <li>dimension, <a href="#dimension"

css3-values/Overview.src.html

@@ -982,7 +982,47 @@ <h3 id="calc">
   table cells in both auto and fixed layout tables may be treated as if
   'auto' had been specified.
 
+<h3 id="cycle">
+Cycling Values: ''cycle()''</h3>
+
+	<p>The <dfn>''cycle()''</dfn> expression allows descendant elements
+	to cycle over a list of values instead of inheriting the same value.
+	The syntax of the ''cycle()'' expression is:
+
+	<pre>cycle( &lt;value&gt;# )</pre>
+
+	<p>where <code>&lt;value&lt;</code> is a CSS value that is valid where
+	the expression is placed.  If any of the values inside are not valid,
+	then the entire ''cycle()'' expression is invalid.
+
+	<p>The value returned by ''cycle()'' must be determined by comparing
+	the inherited value <var>I</var> (the computed value on the parent,
+	or, for the root, the initial value) to the computed values
+	<var>C<sub>n</sub></var> returned by the <var>n</var>-th argument to
+	''cycle()''.
+	For the earliest <var>C<sub>n</sub></var> such that
+	<var>C<sub>n</sub></var> == <var>I</var>, the value returned by cycle
+	is <var>C<sub>n+1</sub></var>.  However, if this <var>C<sub>n</sub></var>
+	is the last value, or if there are no <var>C<sub>n</sub></var> that
+	equal <var>I</var>, the computed value of the first value is returned
+	instead.
 
+	<pre class="example">
+  /* make em elements italic, but make them normal if they're inside
+     something that's italic */
+  em { font-style: cycle(italic, normal); }</pre>
+
+	<pre class="example">
+  /* cycle between markers for nested lists, so that the top level has
+     disk markers, but nested lists use circle, square, box, and then
+     (for the 5th list deep) repeat */
+  ul { list-style-type: disk; }
+  li > ul { list-style-type: cycle(disk, circle, square, box); }</pre>
+
+	<p>The ''cycle()'' notation is not allowed to be nested; nor may it
+	contain ''attr()'', ''calc()'', ''min()'', or ''max()'' notations.
+	Declarations containing such constructs are invalid and must be
+	<a href="http://www.w3.org/TR/CSS21/conform.html#ignore">ignored</a>.
 
 <h3 id="attr">
 Attribute References: ''attr()''</h3>