Selectors Tests

These tests demonstrate CSS Selectors support.

CSS 1.0 Selectors

* (any element)

Sample query: *

div class="structure" span lang="en-US" span lang="nl-NL" span lang="ru-RU"

E (any E element)

Sample query: div

div class="structure" span lang="en-US" span lang="nl-NL" span lang="ru-RU"

E F (any F element that is a descendant of an E element)

Sample query: div span

div class="structure" span lang="en-US" span lang="nl-NL" span lang="ru-RU"

E[foo] (any E element with the "foo" attribute set)

Sample query: span[lang]

div class="structure" span lang="en-US" span lang="nl-NL" span lang="ru-RU"

DIV.warning (the same as DIV[class~="warning"])

Sample query: .structure

div class="structure" span lang="en-US" span lang="nl-NL" span lang="ru-RU"

E#myid (any E element with ID equal to "myid")

Sample query: span#myid

div class="structure" span lang="en-US" span lang="nl-NL" id="myid" span lang="ru-RU"

CSS 2.1 Selectors

E + F (any F element immediately preceded by a sibling element E)

Sample query: span+span

div class="structure" span lang="en-US" span lang="nl-NL" span lang="ru-RU"

E > F (any F element that is a child of an element E)

Sample query: div>span

div class="structure" span lang="en-US" span lang="nl-NL" span lang="ru-RU"

E[foo="warning"] (any E element whose "foo" attribute value is exactly equal to "warning")

Sample query: span[lang="nl-NL"]

div class="structure" span lang="en-US" span lang="nl-NL" span lang="ru-RU"

E[foo~="warning"] (any E element whose "foo" attribute value is a list of space-separated values, one of which is exactly equal to "warning")

Sample query: div[class~="warning"]

div class="structure" span lang="en-US" span lang="nl-NL" span lang="ru-RU"

div class="structure warning"

E[lang|="en"] (any E element whose "lang" attribute has a hyphen-separated list of values beginning (from the left) with "en")

Sample query: span[lang|="en"]

div class="structure" span lang="en-US" span lang="nl-NL" span lang="ru-RU"

E:first-child (element E when E is the first child of its parent)

Sample query: span:first-child

div class="structure" span lang="en-US" span lang="nl-NL" span lang="ru-RU"

E:lang(c) (element of type E if it is in (human) language c)

Sample query: span:lang(ru)

div class="structure" span lang="en-US" span lang="nl-NL" span lang="ru-RU"