CSS3 选择器概览
下面这份CSS3 选择器表还属于w3c草案,但也可让我们先一睹CSS3 概貌。
Selector type | Pattern | Description |
---|---|---|
Substring matching attribute selector | E[att^=”val”] | Matches any E element whose att attribute value begins with “val”. |
Substring matching attribute selector | E[att$=”val”] | Matches any E element whose att attribute value ends with “val”. |
Substring matching attribute selector | E[att*=”val”] | Matches any E element whose att attribute value contains the substring “val”. |
Structural pseudo-class | E:root | Matches the document’s root element. In HTML, the root element is always the HTML element. |
Structural pseudo-class | E:nth-child(n) | Matches any E element that is the n-th child of its parent. |
Structural pseudo-class | E:nth-last-child(n) | Matches any E element that is the n-th child of its parent, counting from the last child. |
Structural pseudo-class | E:nth-of-type(n) | Matches any E element that is the n-th sibling of its type. |
Structural pseudo-class | E:nth-last-of-type(n) | Matches any E element that is the n-th sibling of its type, counting from the last sibling. |
Structural pseudo-class | E:last-child | Matches any E element that is the last child of its parent. |
Structural pseudo-class | E:first-of-type | Matches any E element that is the first sibling of its type. |
Structural pseudo-class | E:last-of-type | Matches any E element that is the last sibling of its type. |
Structural pseudo-class | E:only-child | Matches any E element that is the only child of its parent. |
Structural pseudo-class | E:only-of-type | Matches any E element that is the only sibling of its type. |
Structural pseudo-class | E:empty | Matches any E element that has no children (including text nodes). |
Target pseudo-class | E:target | Matches an E element that is the target of the referring URL. |
UI element states pseudo-class | E:enabled | Matches any user interface element (form control) E that is enabled. |
UI element states pseudo-class | E:disabled | Matches any user interface element (form control) E that is disabled. |
UI element states pseudo-class | E:checked | Matches any user interface element (form control) E that is checked. |
UI element fragments pseudo-element | E::selection | Matches the portion of an element E that is currently selected or highlighted by the user. |
Negation pseudo-class | E:not(s) | Matches any E element that does not match the simple selector s. |
General sibling combinator | E ~ F | Matches any F element that is preceded by an E element. |