comparison: selectors/Overview.bs
selectors/Overview.bs
- changeset 16986
- 5be73fbc8592
- parent 16913
- 9e2ac0ef4b9c
- child 16989
- 255258410d1b
equal
deleted
inserted
replaced
| 16985:84b2940a9c52 | 16986:5be73fbc8592 |
|---|---|
| 3 Group: CSSWG | 3 Group: CSSWG |
| 4 Shortname: selectors | 4 Shortname: selectors |
| 5 Level: 4 | 5 Level: 4 |
| 6 Status: ED | 6 Status: ED |
| 7 Work Status: Revising | 7 Work Status: Revising |
| 8 ED: http://dev.w3.org/csswg/selectors | 8 ED: https://drafts.csswg.org/selectors |
| 9 TR: http://www.w3.org/TR/selectors/ | 9 TR: http://www.w3.org/TR/selectors/ |
| 10 Previous Version: http://www.w3.org/TR/2013/WD-selectors4-20130502/ | 10 Previous Version: http://www.w3.org/TR/2013/WD-selectors4-20130502/ |
| 11 Previous Version: http://www.w3.org/TR/2012/WD-selectors4-20120823/ | 11 Previous Version: http://www.w3.org/TR/2012/WD-selectors4-20120823/ |
| 12 Previous Version: http://www.w3.org/TR/2011/WD-selectors4-20110929/ | 12 Previous Version: http://www.w3.org/TR/2011/WD-selectors4-20110929/ |
| 13 Editor: Elika J. Etemad / fantasai, Invited Expert, http://fantasai.inkedblade.net/contact | 13 Editor: Elika J. Etemad / fantasai, Invited Expert, http://fantasai.inkedblade.net/contact |
| 2460 The <dfn id='nth-child-pseudo' lt=":nth-child()">:nth-child(<var>An+B</var> [of <var>S</var>]? )</dfn> | 2460 The <dfn id='nth-child-pseudo' lt=":nth-child()">:nth-child(<var>An+B</var> [of <var>S</var>]? )</dfn> |
| 2461 pseudo-class notation represents the <var>An+B</var>th element | 2461 pseudo-class notation represents the <var>An+B</var>th element |
| 2462 that matches the <a>selector list</a> <var>S</var> | 2462 that matches the <a>selector list</a> <var>S</var> |
| 2463 among its <a>inclusive siblings</a>. | 2463 among its <a>inclusive siblings</a>. |
| 2464 | 2464 |
| 2465 The CSS Syntax Module [[!CSS3SYN]] defines the <a href="http://dev.w3.org/csswg/css-syntax/#anb"><var>An+B</var> notation</a>. | 2465 The CSS Syntax Module [[!CSS3SYN]] defines the <a href="https://drafts.csswg.org/css-syntax/#anb"><var>An+B</var> notation</a>. |
| 2466 If <var>S</var> is omitted, | 2466 If <var>S</var> is omitted, |
| 2467 it defaults to ''*''. | 2467 it defaults to ''*''. |
| 2468 | 2468 |
| 2469 For example, this selector could address every other row in a table, | 2469 For example, this selector could address every other row in a table, |
| 2470 and could be used to alternate the color of paragraph text in a cycle of four. | 2470 and could be used to alternate the color of paragraph text in a cycle of four. |
| 2537 pseudo-class notation represents the <var>An+B</var>th element | 2537 pseudo-class notation represents the <var>An+B</var>th element |
| 2538 that matches the <a>selector list</a> <var>S</var> | 2538 that matches the <a>selector list</a> <var>S</var> |
| 2539 among its <a>inclusive siblings</a>, | 2539 among its <a>inclusive siblings</a>, |
| 2540 counting backwards from the end. | 2540 counting backwards from the end. |
| 2541 | 2541 |
| 2542 The CSS Syntax Module [[!CSS3SYN]] defines the <a href="http://dev.w3.org/csswg/css-syntax/#anb"><var>An+B</var> notation</a>. | 2542 The CSS Syntax Module [[!CSS3SYN]] defines the <a href="https://drafts.csswg.org/css-syntax/#anb"><var>An+B</var> notation</a>. |
| 2543 If <var>S</var> is omitted, | 2543 If <var>S</var> is omitted, |
| 2544 it defaults to ''*''. | 2544 it defaults to ''*''. |
| 2545 | 2545 |
| 2546 <div class="example"> | 2546 <div class="example"> |
| 2547 Examples: | 2547 Examples: |
| 2633 The <dfn id='nth-of-type-pseudo' lt=":nth-of-type()">:nth-of-type(<var>An+B</var>)</dfn> pseudo-class notation | 2633 The <dfn id='nth-of-type-pseudo' lt=":nth-of-type()">:nth-of-type(<var>An+B</var>)</dfn> pseudo-class notation |
| 2634 represents the <var>An+B</var>th element | 2634 represents the <var>An+B</var>th element |
| 2635 with the same <a section href="#type-nmsp">namespace</a> and <a section href="#type-selectors">type</a> | 2635 with the same <a section href="#type-nmsp">namespace</a> and <a section href="#type-selectors">type</a> |
| 2636 among its <a>inclusive siblings</a>. | 2636 among its <a>inclusive siblings</a>. |
| 2637 | 2637 |
| 2638 The CSS Syntax Module [[!CSS3SYN]] defines the <a href="http://dev.w3.org/csswg/css-syntax/#anb"><var>An+B</var> notation</a>. | 2638 The CSS Syntax Module [[!CSS3SYN]] defines the <a href="https://drafts.csswg.org/css-syntax/#anb"><var>An+B</var> notation</a>. |
| 2639 | 2639 |
| 2640 <div class="example"> | 2640 <div class="example"> |
| 2641 CSS example: | 2641 CSS example: |
| 2642 This allows an author to alternate the position of floated images: | 2642 This allows an author to alternate the position of floated images: |
| 2643 | 2643 |
| 2660 represents the <var>An+B</var>th element | 2660 represents the <var>An+B</var>th element |
| 2661 with the same <a section href="#type-nmsp">namespace</a> and <a section href="#type-selectors">type</a> | 2661 with the same <a section href="#type-nmsp">namespace</a> and <a section href="#type-selectors">type</a> |
| 2662 among its <a>inclusive siblings</a>, | 2662 among its <a>inclusive siblings</a>, |
| 2663 counting backwards from the end. | 2663 counting backwards from the end. |
| 2664 | 2664 |
| 2665 The CSS Syntax Module [[!CSS3SYN]] defines the <a href="http://dev.w3.org/csswg/css-syntax/#anb"><var>An+B</var> notation</a>. | 2665 The CSS Syntax Module [[!CSS3SYN]] defines the <a href="https://drafts.csswg.org/css-syntax/#anb"><var>An+B</var> notation</a>. |
| 2666 | 2666 |
| 2667 <div class="example"> | 2667 <div class="example"> |
| 2668 Example: | 2668 Example: |
| 2669 To represent all <code>h2</code> children of an XHTML | 2669 To represent all <code>h2</code> children of an XHTML |
| 2670 <code>body</code> except the first and last, one could use the | 2670 <code>body</code> except the first and last, one could use the |
| 2946 based on the semantics of the document language only: whether and how the | 2946 based on the semantics of the document language only: whether and how the |
| 2947 elements are presented is not considered. If a cell element belongs to | 2947 elements are presented is not considered. If a cell element belongs to |
| 2948 more than one column, it is represented by a selector indicating any of | 2948 more than one column, it is represented by a selector indicating any of |
| 2949 those columns. | 2949 those columns. |
| 2950 | 2950 |
| 2951 The CSS Syntax Module [[!CSS3SYN]] defines the <a href="http://dev.w3.org/csswg/css-syntax/#anb"><var>An+B</var> notation</a>. | 2951 The CSS Syntax Module [[!CSS3SYN]] defines the <a href="https://drafts.csswg.org/css-syntax/#anb"><var>An+B</var> notation</a>. |
| 2952 | 2952 |
| 2953 | 2953 |
| 2954 | 2954 |
| 2955 <h3 id="the-nth-last-column-pseudo"> | 2955 <h3 id="the-nth-last-column-pseudo"> |
| 2956 '':nth-last-column()'' pseudo-class</h3> | 2956 '':nth-last-column()'' pseudo-class</h3> |
| 2963 based on the semantics of the document language only: whether and how the | 2963 based on the semantics of the document language only: whether and how the |
| 2964 elements are presented is not considered. If a cell element belongs to | 2964 elements are presented is not considered. If a cell element belongs to |
| 2965 more than one column, it is represented by a selector indicating any of | 2965 more than one column, it is represented by a selector indicating any of |
| 2966 those columns. | 2966 those columns. |
| 2967 | 2967 |
| 2968 The CSS Syntax Module [[!CSS3SYN]] defines the <a href="http://dev.w3.org/csswg/css-syntax/#anb"><var>An+B</var> notation</a>. | 2968 The CSS Syntax Module [[!CSS3SYN]] defines the <a href="https://drafts.csswg.org/css-syntax/#anb"><var>An+B</var> notation</a>. |
| 2969 | 2969 |
| 2970 <h2 id="specificity-rules"> | 2970 <h2 id="specificity-rules"> |
| 2971 Calculating a selector's specificity</h2> | 2971 Calculating a selector's specificity</h2> |
| 2972 | 2972 |
| 2973 A selector's <dfn export>specificity</dfn> is calculated for a given element as follows: | 2973 A selector's <dfn export>specificity</dfn> is calculated for a given element as follows: |
