CSS Level 4 selectors

All CSS selectors from level 1 to upcoming version 4. This is still a draft version. At this moment browser support for CSS4 is poor (latest Chrome scores only 32%). For future reference, W3C: " if you are looking for a stable Selectors specification, use Selectors 3 ".

 

Pattern Represents Section Level
* any element §5.2 Universal selector 2
E an element of type E §5.1 Type (tag name) selector 1
E:not(s1, s2) an E element that does not match either compound selector s1 or compound selector s2 §4.3 The Negation Pseudo-class: :not() 3/4
E:matches(s1, s2) an E element that matches compound selector s1 and/or compound selector s2 §4.2 The Matches-any Pseudo-class: :matches() 4
E:has(rs1, rs2) an E element,
if either of the relative selectors rs1 or rs2,
when evaluated with E as the :scope elements,
match an element
§4.4 The Relational Pseudo-class: :has() 4
E.warning an E element belonging to the class warning (the document language specifies how class is determined). §6.6 Class selectors 1
E#myid an E element with ID equal to myid. §6.7 ID selectors 1
E[foo] an E element with a foo attribute §6 Attribute selectors 2
E[foo="bar"] an E element whose foo attribute value is
exactly equal to bar
§6 Attribute selectors 2
E[foo="bar" i] an E element whose foo attribute value is
exactly equal to any (ASCII-range) case-permutation of bar
§6.3 Case-sensitivity 4
E[foo~="bar"] an E element whose foo attribute value is
a list of whitespace-separated values, one of which is
exactly equal to bar
§6 Attribute selectors 2
E[foo^="bar"] an E element whose foo attribute value
begins exactly with the string bar
§6.2 Substring matching attribute selectors 3
E[foo$="bar"] an E element whose foo attribute value
ends exactly with the string bar
§6.2 Substring matching attribute selectors 3
E[foo*="bar"] an E element whose foo attribute value
contains the substring bar
§6.2 Substring matching attribute selectors 3
E[foo|="en"] an E element whose foo attribute value is
a hyphen-separated list of values beginning with en
§6 Attribute selectors 2
E:dir(ltr) an element of type E in with left-to-right directionality
(the document language specifies how directionality is determined)
§7.1 The Directionality Pseudo-class: :dir() 4
E:lang(zh, "*-hant") an element of type E tagged as being either in Chinese
(any dialect or writing system)
or othewise written with traditional Chinese characters
§7.2 The Language Pseudo-class: :lang() 2/4
E:any-link an E element being the source anchor of a hyperlink §8.1 The Hyperlink Pseudo-class: :any-link 4
E:link an E element being the source anchor of a hyperlink
of which the target is not yet visited
§8.2 The Link History Pseudo-classes: :link and :visited 1
E:visited an E element being the source anchor of a hyperlink
of which the target is already visited
§8.2 The Link History Pseudo-classes: :link and :visited 1
E:target an E element being the target of the referring URL §8.3 The Target Pseudo-class: :target 3
E:scope an E element being a designated reference element §8.4 The Reference Element Pseudo-class: :scope 4
E:current an E element that is currently presented in a time-dimensional canvas §10 Time-dimensional Pseudo-classes 4
E:current(s) an E element that is the deepest :current element that
matches selector s
§10 Time-dimensional Pseudo-classes 4
E:past an E element that is in the past in a time-dimensional canvas §10 Time-dimensional Pseudo-classes 4
E:future an E element that is in the future in a time-dimensional canvas §10 Time-dimensional Pseudo-classes 4
E:active an E element that is in an activated state §9 User Action Pseudo-classes 1
E:hover an E element that is under the cursor,
or that has a descendant under the cursor
§9 User Action Pseudo-classes 2
E:focus an E element that has user input focus §9 User Action Pseudo-classes 2
E:drop an E element that can possibly receieve a drop §9.5 The Drag-and-Drop Pseudo-class: :drop and :drop() 4
E:drop(active) an E element that is the current drop target for the item being dragged §9.5 The Drag-and-Drop Pseudo-class: :drop and :drop() 4
E:drop(valid) an E element that could receive the item currently being dragged §9.5 The Drag-and-Drop Pseudo-class: :drop and :drop() 4
E:drop(invalid) an E element that cannot receive the item currently being dragged, but could receive some other item §9.5 The Drag-and-Drop Pseudo-class: :drop and :drop() 4
E:enabled
E:disabled
a user interface element E that is enabled or disabled, respectively §11.1.1 The :enabled and :disabled Pseudo-classes 3
E:read-write
E:read-only
a user interface element E that is user alterable, or not §11.1.2 The Mutability Pseudo-classes: :read-only and :read-write 3-UI/4
E:placeholder-shown an input control currently showing placeholder text §11.1.2 The Mutability Pseudo-classes: :read-only and :read-write 3-UI/4
E:default a user interface element E that is the default item in a group of related choices §11.1.4 The Default-option Pseudo-class: :default 3-UI/4
E:checked a user interface element E that is checked/selected
(for instance a radio-button or checkbox)
§11.2.1 The Selected-option Pseudo-class: :checked 3
E:indeterminate a user interface element E that is in an indeterminate state
(neither checked nor unchecked)
§11.2.2 The Indeterminate-value Pseudo-class: :indeterminate 4
E:valid
E:invalid
a user-input element E that meets, or doesn’t, its data validity semantics §11.3.2 The Range Pseudo-classes: :in-range and :out-of-range 3-UI/4
E:in-range
E:out-of-range
a user-input element E whose value is in-range/out-of-range §11.3.2 The Range Pseudo-classes: :in-range and :out-of-range 3-UI/4
E:required
E:optional
a user-input element E that requires/does not require input §11.3.3 The Optionality Pseudo-classes: :required and :optional 3-UI/4
E:user-error a user-altered user-input element E with incorrect input (invalid, out-of-range, omitted-but-required) §11.3.4 The User-interaction Pseudo-class: :user-invalid 4
E:root an E element, root of the document §12 Tree-Structural pseudo-classes 3
E:empty an E element that has no children (not even text nodes) §12 Tree-Structural pseudo-classes 3
E:blank an E element that has no content except maybe white space §12 Tree-Structural pseudo-classes 4
E:nth-child(n [of S]?) an E element, the n-th child of its parent matching S §12.4 Child-indexed Pseudo-classes 3
E:nth-last-child(n [of S]?) an E element, the n-th child of its parent matching S,
counting from the last one
§12.4 Child-indexed Pseudo-classes 3
E:first-child an E element, first child of its parent §12.4 Child-indexed Pseudo-classes 2
E:last-child an E element, last child of its parent §12.4 Child-indexed Pseudo-classes 3
E:only-child an E element, only child of its parent §12.4 Child-indexed Pseudo-classes 3
E:nth-of-type(n) an E element, the n-th sibling of its type §12.5 Typed Child-indexed Pseudo-classes 3
E:nth-last-of-type(n) an E element, the n-th sibling of its type,
counting from the last one
§12.5 Typed Child-indexed Pseudo-classes 3
E:first-of-type an E element, first sibling of its type §12.5 Typed Child-indexed Pseudo-classes 3
E:last-of-type an E element, last sibling of its type §12.5 Typed Child-indexed Pseudo-classes 3
E:only-of-type an E element, only sibling of its type §12.5 Typed Child-indexed Pseudo-classes 3
E F or E >> F an F element descendant of an E element §13.1 Descendant combinator ( ) or (>>) 1 or 4
E > F an F element child of an E element §13.2 Child combinator (>) 2
E + F an F element immediately preceded by an E element §13.3 Next-sibling combinator (+) 2
E ~ F an F element preceded by an E element §13.4 Following-sibling combinator (~) 3
F || E an E element that represents a cell in a grid/table
belonging to a column represented by an element F
§14 Grid-Structural Selectors 4
E:nth-column(n) an E element that represents a cell belonging to the nth column in a grid/table §14 Grid-Structural Selectors 4
E:nth-last-column(n) an E element that represents a cell belonging to the nth column in a grid/table, counting from the last one §14 Grid-Structural Selectors 4

Leave a Reply