<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
<HTML>
<HEAD>
<TITLE>CSS1 Test Suite: 2.6 Multiple Pseudo-Elements</TITLE>
<META http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<META http-equiv="Content-Style-Type" content="text/css">
<LINK rel="stylesheet" type="text/css" media="screen" href="../resources/base.css">
<SCRIPT src="../resources/base.js"></SCRIPT>
<STYLE type="text/css">
P:first-line {color: green;}
P:first-letter {color: maroon;}
.two:first-line {font-size: 200%;}
.two:first-letter {font-size: 350%;}
P.three:first-letter {font-size: 350%;}
P.three:first-line {font-variant: small-caps;}
</STYLE>
</HEAD>
<BODY><P>The style declarations which apply to the text below are:</P>
<PRE>P:first-line {color: green;}
P:first-letter {color: maroon;}
.two:first-line {font-size: 200%;}
.two:first-letter {font-size: 350%;}
P.three:first-letter {font-size: 350%;}
P.three:first-line {font-variant: small-caps;}
</PRE>
<HR>
<P>
The first letter of this paragraph, and only that one, should be maroon (dark red), while the entire first line should be green. If this precise combination does not occur, then the user agent has failed this test. Remember that in order to ensure a complete test, the paragraph must be displayed on more than one line.
</P>
<P class="two">
The first letter of this paragraph, and only that one, should be 350% bigger than the rest of the first line of this paragraph and maroon (dark red), while the entire first line should be 200% bigger than normal and green. If this precise combination does not occur, then the user agent has failed this test. Remember that in order to ensure a complete test, the paragraph must be displayed on more than one line.
</P>
<P class="three">
"We should check for quotation support," it was said. The first two characters in this paragraph-- a double-quote mark and a capital 'W'-- should be 350% bigger than the rest of the paragraph, and maroon (dark red). Note that the inclusion of both the quotation mark and the 'W' in the first-letter style is not required under CSS1, but it is recommended. In addition, the entire first line should be in a small-caps font and green.
</P>
<TABLE border cellspacing="0" cellpadding="3" class="tabletest">
<TR>
<TD colspan="2" bgcolor="silver"><STRONG>TABLE Testing Section</STRONG></TD>
</TR>
<TR>
<TD bgcolor="silver"> </TD>
<TD><P>
The first letter of this paragraph, and only that one, should be maroon (dark red), while the entire first line should be green. If this precise combination does not occur, then the user agent has failed this test. Remember that in order to ensure a complete test, the paragraph must be displayed on more than one line.
</P>
<P class="two">
The first letter of this paragraph, and only that one, should be 350% bigger than the rest of the first line of this paragraph and maroon (dark red), while the entire first line should be 200% bigger than normal and green. If this precise combination does not occur, then the user agent has failed this test. Remember that in order to ensure a complete test, the paragraph must be displayed on more than one line.
</P>
<P class="three">
"We should check for quotation support," it was said. The first two characters in this paragraph-- a double-quote mark and a capital 'W'-- should be 350% bigger than the rest of the paragraph, and maroon (dark red). Note that the inclusion of both the quotation mark and the 'W' in the first-letter style is not required under CSS1, but it is recommended. In addition, the entire first line should be in a small-caps font and green.
</P>
</TD></TR></TABLE></BODY>
</HTML>
Codebase Browser
chromium