<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
  <title>CSS: Specificity Tests</title>
  <style type="text/css">
    @namespace url(http://www.example.org/);
    @namespace test url(http://www.example.org/test);
    @namespace html url(http://www.w3.org/1999/xhtml);
    *|* { display: block; margin: 0; padding: 0; }
    html|head { display: none; }
    universal1 > :not(test|*) { color: red; }
    universal1 > * { color: green; }
    universal2 > * { color: red; }
    universal2 > :not(test|*) { color: green; }
    element1 > :not(html|test) { color: red; }
    element1 > test { color: green; }
    element2 > test { color: red; }
    element2 > :not(html|test) { color: green; }
    attribute1 > :not([TEST]) { color: red; }
    attribute1 > [test] { color: green; }
    attribute2 > [test] { color: red; }
    attribute2 > :not([TEST]) { color: green; }
  </style>
  <style type="text/css">
    /* no default namespace */
    id1 > :not(#TEST1) { color: red; }
    id1 > #test1 { color: green; }
    id2 > #test2 { color: red; }
    id2 > :not(#TEST2) { color: green; }
  </style>
 </head>
 <body>
  <tests xmlns="http://www.example.org/">
    <universal1> <test> This should be green. (universal1) </test> </universal1>
    <universal2> <test> This should be green. (universal2) </test> </universal2>
    <element1> <test> This should be green. (element1) </test> </element1>
    <element2> <test> This should be green. (element2) </test> </element2>
    <attribute1> <test test="set"> This should be green. (attribute1) </test> </attribute1>
    <attribute2> <test test="set"> This should be green. (attribute2) </test> </attribute2>
    <id1> <span id="test1" xmlns="http://www.w3.org/1999/xhtml"> This should be green. (id1) </span> </id1>
    <id2> <span id="test2" xmlns="http://www.w3.org/1999/xhtml"> This should be green. (id2) </span> </id2>
  </tests>
 </body>
</html>
