@@ -139,9 +139,9 @@ <h2 class="no-num no-toc" id=status>Status of this document</h2>
139139 ‘< a href ="#vw-unit "> < code class =css > vw</ code > </ a > ’, ‘< a
140140 href ="#vm-unit "> < code class =css > vm</ code > </ a > ’, ‘< a
141141 href ="#fr-unit "> < code class =css > fr</ code > </ a > ’, ‘< a
142- href ="#gr-unit "> < code class =css > gr</ code > </ a > ’, ‘< code
143- class =css > cycle()</ code > ’, ‘< code
144- class =css > attr()</ code > ’.
142+ href ="#gr-unit "> < code class =css > gr</ code > </ a > ’, ‘< a
143+ href =" #cycle-value " > < code class =css > cycle()</ code > </ a > ’, ‘< a
144+ href =" #attr-value " > < code class =css > attr()</ code > </ a > ’.
145145
146146 < h2 class ="no-num no-toc " id =contents > Table of contents</ h2 >
147147 <!--begin-toc-->
@@ -1452,37 +1452,38 @@ <h3 id=calc><span class=secno>9.1. </span> Mathematical Expressions:
14521452 treated as if ‘< code class =property > auto</ code > ’ had been
14531453 specified.
14541454
1455- < h3 id =cycle > < span class =secno > 9.2. </ span > Cycling Values: ‘< code
1456- class =css > cycle()</ code > ’</ h3 >
1455+ < h3 id =cycle > < span class =secno > 9.2. </ span > Cycling Values: ‘< a
1456+ href =" #cycle-value " > < code class =css > cycle()</ code > </ a > ’</ h3 >
14571457
1458- < p > The < dfn id =cycle0 > ‘ < code class = css > cycle()</ code > ’ </ dfn >
1459- expression allows descendant elements to cycle over a list of values
1460- instead of inheriting the same value. The syntax of the ‘< code
1461- class =css > cycle()</ code > ’ expression is:
1458+ < p > The < dfn id =cycle-value > cycle()</ dfn > expression allows descendant
1459+ elements to cycle over a list of values instead of inheriting the same
1460+ value. The syntax of the ‘< a href =" #cycle-value " > < code
1461+ class =css > cycle()</ code > </ a > ’ expression is:
14621462
14631463 < pre > cycle( <value># )</ pre >
14641464
14651465 < p > where < code > <value></ code > is a CSS value that is valid where the
14661466 expression is placed. If any of the values inside are not valid, then the
1467- entire ‘< code class =css > cycle()</ code > ’ expression is invalid.
1468-
1469-
1470- < p > The value returned by ‘< code class =css > cycle()</ code > ’ must
1471- be determined by comparing the inherited value < var > I</ var > (the computed
1472- value on the parent, or, for the root, the initial value) to the computed
1473- values < var > C< sub > n</ sub > </ var > returned by the < var > n</ var > -th argument
1474- to ‘< code class =css > cycle()</ code > ’. For the earliest
1475- < var > C< sub > n</ sub > </ var > such that < var > C< sub > n</ sub > </ var > =
1476- < var > I</ var > , the value returned by cycle is < var > C< sub > n+1</ sub > </ var > .
1477- However, if this < var > C< sub > n</ sub > </ var > is the last value, or if there
1478- are no < var > C< sub > n</ sub > </ var > that equal < var > I</ var > , the computed
1479- value of the first value is returned instead.
1480-
1481- < p class =note > Note that ‘< code class =css > cycle()</ code > ’
1482- explicitly looks at the computed value of the parent, so it is useful even
1483- for non-inherited properties. This is similar to the ‘< code
1484- class =css > inherit</ code > ’ keyword, which is useful even for
1485- non-inherited properties.
1467+ entire ‘< a href ="#cycle-value "> < code
1468+ class =css > cycle()</ code > </ a > ’ expression is invalid.
1469+
1470+ < p > The value returned by ‘< a href ="#cycle-value "> < code
1471+ class =css > cycle()</ code > </ a > ’ must be determined by comparing the
1472+ inherited value < var > I</ var > (the computed value on the parent, or, for
1473+ the root, the initial value) to the computed values
1474+ < var > C< sub > n</ sub > </ var > returned by the < var > n</ var > -th argument to
1475+ ‘< a href ="#cycle-value "> < code class =css > cycle()</ code > </ a > ’.
1476+ For the earliest < var > C< sub > n</ sub > </ var > such that
1477+ < var > C< sub > n</ sub > </ var > = < var > I</ var > , the value returned by cycle is
1478+ < var > C< sub > n+1</ sub > </ var > . However, if this < var > C< sub > n</ sub > </ var > is
1479+ the last value, or if there are no < var > C< sub > n</ sub > </ var > that equal
1480+ < var > I</ var > , the computed value of the first value is returned instead.
1481+
1482+ < p class =note > Note that ‘< a href ="#cycle-value "> < code
1483+ class =css > cycle()</ code > </ a > ’ explicitly looks at the computed value
1484+ of the parent, so it is useful even for non-inherited properties. This is
1485+ similar to the ‘< code class =css > inherit</ code > ’ keyword, which
1486+ is useful even for non-inherited properties.
14861487
14871488 < div class =example >
14881489 < pre >
@@ -1500,37 +1501,40 @@ <h3 id=cycle><span class=secno>9.2. </span> Cycling Values: ‘<code
15001501 li > ul { list-style-type: cycle(disk, circle, square, box); }</ pre >
15011502 </ div >
15021503
1503- < p > The ‘< code class =css > cycle()</ code > ’ notation is not allowed
1504- to be nested; nor may it contain ‘< code
1505- class =css > attr()</ code > ’, ‘< a href ="#calc0 "> < code
1504+ < p > The ‘< a href ="#cycle-value "> < code
1505+ class =css > cycle()</ code > </ a > ’ notation is not allowed to be nested;
1506+ nor may it contain ‘< a href ="#attr-value "> < code
1507+ class =css > attr()</ code > </ a > ’, ‘< a href ="#calc0 "> < code
15061508 class =css > calc()</ code > </ a > ’, ‘< a href ="#min "> < code
15071509 class =css > min()</ code > </ a > ’, or ‘< a href ="#max "> < code
15081510 class =css > max()</ code > </ a > ’ notations. Declarations containing such
15091511 constructs are invalid.
15101512
1511- < h3 id =attr > < span class =secno > 9.3. </ span > Attribute References:
1512- ‘ < code class =css > attr()</ code > ’</ h3 >
1513+ < h3 id =attr > < span class =secno > 9.3. </ span > Attribute References: ‘ < a
1514+ href =" #attr-value " > < code class =css > attr()</ code > </ a > ’</ h3 >
15131515
1514- < p > The ‘ < code class = css > attr()</ code > ’ function returns the
1515- value of an attribute on the element for use as a value in a property. If
1516- used on a pseudo-element, it returns the value of the attribute on the
1516+ < p > The < dfn id = attr-value > attr()</ dfn > function returns the value of an
1517+ attribute on the element for use as a value in a property. If used on a
1518+ pseudo-element, it returns the value of the attribute on the
15171519 pseudo-element's originating element.
15181520
15191521 < p > In CSS2.1 < a href ="#CSS21 " rel =biblioentry > [CSS21]<!--{{!CSS21}}--> </ a > ,
1520- the ‘< code class =css > attr()</ code > ’ expression always returns
1521- a string. In CSS3, the ‘< code class =css > attr()</ code > ’
1522- expression can return many different types. The ‘< code
1523- class =css > attr()</ code > ’ expression cannot return everything, for
1524- example it cannot do counters, named strings, quotes, or values such as
1525- ‘< code class =css > auto</ code > ’, ‘< code
1522+ the ‘< a href ="#attr-value "> < code class =css > attr()</ code > </ a > ’
1523+ expression always returns a string. In CSS3, the ‘< a
1524+ href ="#attr-value "> < code class =css > attr()</ code > </ a > ’ expression can
1525+ return many different types. The ‘< a href ="#attr-value "> < code
1526+ class =css > attr()</ code > </ a > ’ expression cannot return everything,
1527+ for example it cannot do counters, named strings, quotes, or values such
1528+ as ‘< code class =css > auto</ code > ’, ‘< code
15261529 class =css > nowrap</ code > ’, or ‘< code
15271530 class =css > baseline</ code > ’. This is intentional, as the intent of
1528- the ‘< code class =css > attr()</ code > ’ expression is not to make
1529- it possible to describe a presentational language's formatting using CSS,
1530- but to enable CSS to take semantic data into account.
1531+ the ‘< a href ="#attr-value "> < code class =css > attr()</ code > </ a > ’
1532+ expression is not to make it possible to describe a presentational
1533+ language's formatting using CSS, but to enable CSS to take semantic data
1534+ into account.
15311535
1532- < p > The new syntax for the ‘< code class = css > attr() </ code > ’
1533- expression is:
1536+ < p > The new syntax for the ‘< a href =" # attr-value " > < code
1537+ class = css > attr() </ code > </ a > ’ expression is:
15341538
15351539 < pre > 'attr(' < a
15361540 href ="#wqname "> < var > wqname</ var > </ a > [ ',' <type> [ ',' <value> ]? ]? ')'</ pre >
@@ -1547,29 +1551,33 @@ <h3 id=attr><span class=secno>9.3. </span> Attribute References:
15471551 <!-- TODO: Delete this syntax definition when Namespaces is updated to contain the wqname production -->
15481552
15491553 < p > The < a href ="#wqname "> < i > wqname</ i > </ a > argument represents an attribute
1550- name. The computed value of the ‘< code
1551- class =css > attr()</ code > ’ expression is the value of the attribute
1552- with that name on the element, according to the rules given below.
1554+ name. The computed value of the ‘< a href ="#attr-value "> < code
1555+ class =css > attr()</ code > </ a > ’ expression is the value of the
1556+ attribute with that name on the element, according to the rules given
1557+ below.
15531558
15541559 < p > The ‘< code class =css > <type> </ code > ’ argument (which is
15551560 optional but must be present if the third argument is present) is a
15561561 keyword drawn from the list below that tells the UA how to interpret the
15571562 attribute value. If omitted, ‘< code class =css > string</ code > ’
1558- is implied. If the type is not valid for where the ‘< code
1559- class =css > attr()</ code > ’ expression is placed, the whole
1560- ‘< code class =css > attr()</ code > ’ expression is invalid.
1563+ is implied. If the type is not valid for where the ‘< a
1564+ href ="#attr-value "> < code class =css > attr()</ code > </ a > ’ expression is
1565+ placed, the whole ‘< a href ="#attr-value "> < code
1566+ class =css > attr()</ code > </ a > ’ expression is invalid.
15611567
15621568 < p > The ‘< code class =css > <value> </ code > ’ argument (which is
1563- optional) is a CSS value which must be valid where the ‘< code
1564- class =css > attr()</ code > ’ expression is placed. It represents a
1565- fallback value to be used if the named attribute is missing, or its value
1566- cannot be parsed into the given type or is invalid/out-of-range for the
1567- property. If the ‘< code class =css > <value> </ code > ’ argument
1568- is not valid for the property where the ‘< code
1569- class =css > attr()</ code > ’ expression is placed, the whole
1570- ‘< code class =css > attr()</ code > ’ expression is invalid. If the
1571- fallback ‘< code class =css > <value> </ code > ’ is absent, the
1572- default value for the given type (from the list below) is implied.
1569+ optional) is a CSS value which must be valid where the ‘< a
1570+ href ="#attr-value "> < code class =css > attr()</ code > </ a > ’ expression is
1571+ placed. It represents a fallback value to be used if the named attribute
1572+ is missing, or its value cannot be parsed into the given type or is
1573+ invalid/out-of-range for the property. If the ‘< code
1574+ class =css > <value> </ code > ’ argument is not valid for the property
1575+ where the ‘< a href ="#attr-value "> < code
1576+ class =css > attr()</ code > </ a > ’ expression is placed, the whole
1577+ ‘< a href ="#attr-value "> < code class =css > attr()</ code > </ a > ’
1578+ expression is invalid. If the fallback ‘< code
1579+ class =css > <value> </ code > ’ is absent, the default value for the
1580+ given type (from the list below) is implied.
15731581
15741582 < p class =note > Note that the default value need not be of the type given.
15751583 For instance, if the type required of the attribute by the author is
@@ -1752,9 +1760,11 @@ <h3 id=attr><span class=secno>9.3. </span> Attribute References:
17521760color: attr(color); /* 'color' doesn't accept strings */</ pre >
17531761 </ div >
17541762
1755- < p class =note > The ‘< code class =css > attr()</ code > ’ expression
1756- cannot currently fall back onto another attribute. Future versions of CSS
1757- may extend ‘< code class =css > attr()</ code > ’ in this direction.</ p >
1763+ < p class =note > The ‘< a href ="#attr-value "> < code
1764+ class =css > attr()</ code > </ a > ’ expression cannot currently fall back
1765+ onto another attribute. Future versions of CSS may extend ‘< a
1766+ href ="#attr-value "> < code class =css > attr()</ code > </ a > ’ in this
1767+ direction.</ p >
17581768 <!--
17591769<h4>The 'counter' function</h4>
17601770
@@ -2264,6 +2274,9 @@ <h2 class=no-num id=index>Index</h2>
22642274 < li > <angle>, < a href ="#angle-value "
22652275 title ="<angle> "> < strong > 6.1.</ strong > </ a >
22662276
2277+ < li > attr(), < a href ="#attr-value " title ="attr() "> < strong > 9.3.</ strong > </ a >
2278+
2279+
22672280 < li > calc(), < a href ="#calc0 " title ="calc() "> < strong > 9.1.</ strong > </ a >
22682281
22692282 < li > ch, < a href ="#ch-unit " title =ch > < strong > 5.1.1.</ strong > </ a >
@@ -2274,8 +2287,8 @@ <h2 class=no-num id=index>Index</h2>
22742287 < li > computed value, < a href ="#computed-value "
22752288 title ="computed value "> < strong > 10.2.</ strong > </ a >
22762289
2277- < li > ‘ < code class = css > cycle()</ code > ’ , < a href ="#cycle0 "
2278- title ="'' cycle()'' > < strong > 9.2.</ strong > </ a >
2290+ < li > cycle(), < a href ="#cycle-value "
2291+ title ="cycle() "> < strong > 9.2.</ strong > </ a >
22792292
22802293 < li > deg, < a href ="#deg " title =deg > < strong > 6.1.</ strong > </ a >
22812294
0 commit comments