CSS Selectors
Below are examples of all of the CSS selectors supported by Prince.
For their precise definition please refer to the CSS specifications.
Universal Selectors
* |
elements in the default namespace |
|* |
elements in no namespace |
ns|* |
elements in the namespace with prefix ns
|
*|* |
elements in any or no namespace |
Type Selectors
div |
div elements in the default namespace |
|div |
div elements in no namespace |
ns|div |
div elements in the namespace with prefix ns
|
*|div |
div elements in any namespace or in none |
Descendant Selectors
div p |
p elements that are within a div element
|
* p |
p elements that are within any element (ie. not the root element)
|
Child Selectors
div > p |
p elements that are the direct children of div
elements
|
p > * |
any elements that are the direct children of p elements
|
Direct Sibling Selectors
div + p |
p elements that directly follow div elements
|
p + * |
any elements that directly follow p elements
|
Indirect Sibling Selectors
div ~ p |
p elements anywhere after div elements
|
p ~ * |
any elements anywhere after p elements
|
Attribute Selectors
*[href] |
elements with an href attribute
|
*[align="right"] |
elements with an align attribute of right
|
*[href^="http:"] |
elements with an href attribute beginning with
http:
|
*[href$=foo] |
elements with an href attribute ending with
foo
|
*[href*=foo] |
elements with an href attribute containing foo
|
*[words~=foo] |
elements with a words attribute containing the word
foo
|
*[lang|=en] |
elements with a lang attribute equal to or beginning with
en
|
Class Selectors
p.intro |
p elements with a class attribute containing the
word intro
|
ID Selectors
p#intro |
p elements with an id attribute of
intro
|
Link Selectors
:link |
elements that represent links |
a[href^="mailto:"]:link |
elements that link to an email address |
Language Selectors
:lang(en) |
elements whose specified language is English |
q:lang(fr-CA) |
quotes whose specified language is French (Canadian) |
Contains Selectors
p:contains("synergy") |
paragraphs containing the text "synergy" |
Root Selectors
:root |
the root element of the document |
html:root |
html root elements
|
:root > * |
children of the root element
|
Empty Selectors
div:empty |
every empty div element
|
Negated Selectors
*:not(p) |
every element except p elements
|
div:not(:empty) |
every non-empty div element
|
a:not([href]) |
every a element without a href attribute
|
Child Selectors
div > :first-child |
the first child of a div element
|
div > :last-child |
the last child of a div element
|
div > :only-child |
the only child of a div element
|
Typed Child Selectors
div > p:first-of-type |
the first p element child of a div element
|
div > p:last-of-type |
the last p element child of a div element
|
div > p:only-of-type |
the only p element child of a div element
|
Nth Child Selectors
div > :nth-child(3) |
the third child of a div element
|
div > :nth-child(even) |
every even child of a div element
|
div > :nth-child(odd) |
every odd child of a div element
|
div > :nth-child(3n) |
every third child of a div element
|
Nth Last Child Selectors
div > :nth-last-child(3) |
the third last child of a div element
|
div > :nth-last-child(even) |
every even last child of a div element
|
div > :nth-last-child(odd) |
every odd last child of a div element
|
div > :nth-last-child(3n) |
every third last child of a div element
|
Nth of Type Selectors
div > p:nth-of-type(3) |
the third p element child of a div element
|
div > p:nth-of-type(even) |
every even p element child of a div element
|
div > p:nth-of-type(odd) |
every odd p element child of a div element
|
div > p:nth-of-type(3n) |
every third p element child of a div element
|
Nth Last of Type Selectors
div > p:nth-last-of-type(3) |
the third last p element child of a div element
|
div > p:nth-last-of-type(even) |
every even last p element child of a div element
|
div > p:nth-last-of-type(odd) |
every odd last p element child of a div element
|
div > p:nth-last-of-type(3n) |
every third last p element child of a div element
|
Pseudo-element Selectors
p::before |
the beginning of every p element
|
p::after |
the end of every p element
|
ol > li::marker |
markers in ordered list items
|
p::first-letter |
the first letter of p elements
|
p::first-line |
the first line of p elements
|
::footnote-call |
footnote calls, the anchors that refer to footnotes
|
::footnote-marker |
footnote markers, placed in front of the actual footnote text
|