CSS for sel0-6

  <script>
    p > b  { background-color: red; }  # 0,0,0,2
     div b  { background-color: green; }  # 0,0,0,2
  </script>

Page Content

  <div>
 <p>This is a paragraph.
  <b>This is bold text</b>
   This is the final text paragraphs 1.
 </p>
 <p>This is another paragraph.
  <b>This is bold text and <em>this is emphasized text</em></b>
   This is the final text paragraphs 2.
 </p>
<p>This result is counter intuiative.  It happens because of the way
<em>specificity</em> is determined.  The <em>combinators</em> are not considered
in the <em>specificity</em> computation.</p>
</div>
<p>The right-most <em>specificity</em> number is simply the number of
<em>simple selectors</em> occuring in the rule.</p>

This is a paragraph. This is bold text This is the final text paragraphs 1.

This is another paragraph. This is bold text and this is emphasized text This is the final text paragraphs 2.

This result is counter intuiative. It happens because of the way specificity is determined. The combinators are not considered in the specificity computation.

The right-most specificity number is simply the number of simple selectors occuring in the rule.