Chapter 10. CSS2: A Look Ahead

10.2.1.2. Child selector

<html>
<BODY>
<P>This paragraph is green.</P>

<DIV>
<P>This paragraph is not green.</P>
</DIV>
<P>This paragraph is green.</P>
</BODY>
</html>

10.2.1.2<html>
<BODY>
<OL>
<LI>The EM text here is <EM>not</EM> purple.</LI>
</OL>
<DIV>
<OL>
<LI>Look, a list:
<UL>
<LI>The emphasized text here <EM>is</EM> purple.</LI>
</UL>
</LI>
</OL>
</DIV>
</BODY>
</html>

10.2.1.2.1<html>
<BODY>
<OL>
<LI>The text here is silver.</LI>
</OL>
<DIV>
<UL>
<LI>Look, a list (and this text is not silver, by the way):
<OL>
<LI>The text here is <EM>not</EM> silver.</LI>
</OL>
</LI>
</UL>
</DIV>
</BODY>
</hmtl>

10.2.1.2.1.1
10.2.1.3. Adjacent-sibling selector

<html>
<body bgcolor=”red”>
<H2>Coloring Text</H2>
<P color=”silver”>This paragraph is silver.</P>
<P>This paragraph is not.</P>

<H2>More Coloring Text</H2>
<UL><LI>This is not silver</LI></UL>
<P>Neither is this.</P>

<H2>More Coloring Text</H2>
This text is not silver.
<P color=”silver”>This paragraph is silver.</P>
<P>This paragraph is not.</P>
</body>
</html>

10.2.1.3
10.2.2.1. Attribute matching

<html>
<body bgcolor=”lime”>
<IMG SRC=”04.jpg” BORDER=”1″ ALT=”image one (match)”>
<IMG SRC=”05.jpg” BORDER=”23″ ALT=”image two (match)”>
<IMG SRC=”06.jpg” ALT=”image three (no match)”>
</body></html>

10.2.2.1
10.2.3.3. :lang

<html>
<body bgcolor=”lime”>
<P lang=”en”>This paragraph is in English.</P>
<P lang=”fr”>Ce paragraphe est en fran&ccedil;ais.</P>
</body>
</html>

10.2.3.3

10.2.3.4. :first-child

<html>
<BODY>
<P>This paragraph should be italic.</P>
<P>This paragraph should be normal.</P>
<DIV STYLE=”border: 1px dashed gray;”>
This text should be normal.
<P>This paragraph should be italic.</P>
<P>This paragraph should be normal.</P>
</DIV>
<DIV STYLE=”border: 1px dotted gray;”>
<H2>This H2 should be normal.</H2>
<P>This paragraph should be normal.</P>
<P>This paragraph should be normal.</P>
</DIV>
</BODY>
</html>

10.2.3.4