| Pattern | Meaning | Described in section | First defined in CSS level |
|---|---|---|---|
| * | any element | Universal selector | 2 |
| p | an element of type P | Type selector | 1 |
| a[title] | an A element with a "title" attribute | Attribute selectors | 2 |
| a[rel="bookmark"] | an A element whose "rel" attribute value is exactly equal to "bookmark" | Attribute selectors | 2 |
| a[class~="blog"] | an A element whose "class" attribute value is a list of space-separated values, one of which is exactly equal to "blog" | Attribute selectors | 2 |
| a[href^="http://www.google"] | an A element whose "href" attribute value begins exactly with the string "http://www" | Attribute selectors | 3 |
| a[href$="org/"] | an A element whose "href" attribute value ends exactly with the string "org/" | Attribute selectors | 3 |
| a[href*="google"] | an A element whose "href" attribute value contains the substring "google" | Attribute selectors | 3 |
| a[hreflang|="en"] | an A element whose "hreflang" attribute has a hyphen-separated list of values beginning (from the left) with "en" | Attribute selectors | 2 |
| html:root | an HTML element, root of the document | Structural pseudo-classes | 3 |
| p:nth-child(1) | an P element, the 2nd child of its parent | Structural pseudo-classes | 3 |
| p:nth-child(even) | every even-numbered child | Structural pseudo-classes | 3 |
| p:nth-last-child(1) | an P element, the 2nd child of its parent, counting from the last one | Structural pseudo-classes | 3 |
| p:nth-of-type(1) | an P element, the 2nd sibling of its type | Structural pseudo-classes | 3 |
| p:nth-last-of-type(1) | an P element, the 2nd sibling of its type, counting from the last one | Structural pseudo-classes | 3 |
| p:first-child | an P element, first child of its parent | Structural pseudo-classes | 2 |
| p:last-child | an P element, last child of its parent | Structural pseudo-classes | 3 |
| p:first-of-type | an P element, first sibling of its type | Structural pseudo-classes | 3 |
| p:last-of-type | an P element, last sibling of its type | Structural pseudo-classes | 3 |
| a:only-child | an A element, only child of its parent | Structural pseudo-classes | 3 |
| a:only-of-type | an A element, only sibling of its type | Structural pseudo-classes | 3 |
| *:empty | any element that has no children (including text nodes) | Structural pseudo-classes | 3 |
| div:target | an DIV element being the target of the referring URI | The target pseudo-class | 3 |
| p:lang(en) | an element of type P in language "en" (the document language specifies how language is determined) | The :lang() pseudo-class | 2 |
| input:enabled | a user interface element INPUT which is enabled | The UI element states pseudo-classes | 3 |
| input:disabled | a user interface element INPUT which is disabled | The UI element states pseudo-classes | 3 |
| input:checked | a user interface element INPUT which is a checked state (for instance a radio-button or checkbox) | The UI element states pseudo-classes | 3 |
| input:indeterminate | a user interface element INPUT which is in an indeterminate state (for instance a radio-button or checkbox) | The UI element states pseudo-classes | 3 |
| p:contains("red") | an E element containing the substring "foo" in its textual contents | Content pseudo-class | 3 |
| a.blog | an A element whose class is "blog" (the document language specifies how class is determined). | Class selectors | 1 |
| div#foo | an div element with ID equal to "foo". | ID selectors | 1 |
| E:not(s) | an E element that does not match simple selector s | Negation pseudo-class | 3 |
| code a | an A element descendant of an CODE element | Descendant combinator | 1 |
| p > a | an A element child of an P element | Child combinator | 2 |
| p + p | an P element immediately preceded by an P element | Direct adjacent combinator | 2 |
| p ~ p | an P element preceded by an P element | Indirect adjacent combinator | 3 |
See this blog entry for more information.
Here are some links in a normal paragraph: Google, Google Groups. This link has class="blog": diveintomark
Everything inside the red border is inside a div with id="foo".
This is a normal link: Yahoo
This link has class="blog": Simon Willison's Weblog