1998-04-13 20:24:54 +00:00
< html >
< head >
1998-04-15 19:23:17 +00:00
< title > Example 0< / title >
1998-05-18 21:12:19 +00:00
< style >
a#id.foo:visited:first-line { color: red; }
a#id.foo:first-line { color: red; }
a#id.foo:visited { color: red; }
a#id:first-line { color: red; }
a#id:visited { color: red; }
a:first-line { color: red; }
a:visited { color: red; }
a:visited:first-line { color: red; }
a:visited:visited { color: red; }
a:first-line:visited { color: red; }
:first-letter { color: green; }
1998-10-26 17:13:28 +00:00
#line:first-line { font-size: 200%; letter-spacing: -.25em; }
#letter:first-letter { font-size: 48pt; font-weight: bold; float: left; }
1998-05-18 21:12:19 +00:00
< / style >
1999-02-19 00:54:27 +00:00
< meta name = "crc" content = 3268488385" >
1998-04-13 20:24:54 +00:00
< / head >
1998-04-15 19:23:17 +00:00
1998-09-03 05:07:16 +00:00
< body bgcolor = "#FFFFFF" text = "#000000" >
1998-10-26 17:13:28 +00:00
1999-02-10 09:07:37 +00:00
<!-- GOOFY Comment tests... -->
<!-- xx - - yy - - zz -->
<!-- also interesting - - !>
1999-02-10 09:08:35 +00:00
<!-- - - - - - - - - - - - - - - - - - -->
1999-02-10 09:11:54 +00:00
<!-- ####################################################################
# #
# * Here's another interesting comment problem we encountered #
# this came from mozilla.org of all places! "!-- * --" #
####################################################################
-->
1999-02-10 09:07:37 +00:00
1998-04-15 19:23:17 +00:00
< h1 > Example 0: Basic HTML Text Styles< / h1 >
1998-10-26 17:13:28 +00:00
< P > < br > < / p >
1998-04-15 19:23:17 +00:00
< h2 > Formatted Text< / h2 >
1998-10-26 17:13:28 +00:00
< p >
This is a basic paragraph with < b > bold< / b > , < i > italic< / i > and
< i > < b > bold< / b > < / i > < b > < i > -italic < / i > < / b >
text. It also includes < font color = "#FF0000" > red< / font > ,
< font color = "#00FF00" > green< / font >
and < font color = "#0000FF" > blue< / font > text.
It has < s > strikethru< / s > and < u > underline< / u > .
< u > < / u >
< / p >
1998-09-24 23:28:10 +00:00
< p >
Text decoration color test:
< span style = "color: red" >
red
< span style = "text-decoration: underline" >
underline
< span style = "color: cyan" >
cyan
< span style = "text-decoration: line-through" >
line-through
< span style = "color: blue" >
blue
< span style = "text-decoration: overline" >
overline
< span style = "color: black" >
black
< / span >
overline
< / span >
blue
< / span >
line-through
< / span >
cyan
< / span >
underline
< / span >
red
< / span >
< / p >
1998-10-26 17:13:28 +00:00
1998-09-24 23:28:10 +00:00
< p > This is a paragraph with font variations: < b > < font face = "Arial, Helvetica, sans-serif" > Bold Arial,< / font > < / b > < font face = "Arial, Helvetica, sans-serif" >
< i > < font face = "Verdana, Arial, Helvetica, sans-serif" > Italic Verdana< / font > ,< / i > < font face = "courier" > COURIER,
1998-04-15 19:23:17 +00:00
< font face = "Times New Roman, Times, serif" > Times New Roman.< / font > < / font > < / font > < / p >
< p > < font size = 7 > Font size=7, < / font > < font size = 6 > Font size=6, < / font > < font size = 5 > Font
size=5, < / font > < font size = 4 > Font size=4, < / font > < font size = 3 > Font size=3, < / font > < font size = 2 > Font
size=2, < / font > < font size = 1 > Font size=1, < / font > < font point-size = 24 font-weight = 700 > Font
1998-10-26 17:13:28 +00:00
point-size=24 font-weight=700< / font > < BR >
< SPAN style = "font-family: Verdana Bold, Times; font-weight: bold; font-size: 18pt; font-variant: small-caps;" > This Text Is Small-caps< / SPAN >
< / P >
< h2 > Text styles< / h2 >
< P >
< SPAN style = "text-transform: capitalize;" >
1999-06-11 21:37:08 +00:00
this text was capitalized å è
1998-10-26 17:13:28 +00:00
< / SPAN >
< BR >
< SPAN style = "text-transform: lowercase;" >
1999-06-11 21:37:08 +00:00
THIS TEXT WAS LOWERCASED Å È
1998-10-26 17:13:28 +00:00
< / SPAN >
< BR >
< SPAN style = "text-transform: uppercase;" >
1999-06-11 21:37:08 +00:00
this text was uppercased å è
1998-10-26 17:13:28 +00:00
< / SPAN >
< BR >
< SPAN style = "letter-spacing: 2em;" >
Letter spacing set to 2em's.
< / SPAN >
< BR >
< SPAN style = "word-spacing: 2em;" >
Word spacing set to 2em's.
< / SPAN >
< BR >
< SPAN style = "text-transform: capitalize; letter-spacing: 1em; word-spacing: 5em; font-variant: small-caps;" >
this text is capitalized small-caps with letter spacing set to 1em and
the word spacing set to 5em's. enjoy!
< / SPAN >
< / P >
< H2 > Pseudo-element tests< / H2 >
< P ID = line >
This paragraph demonstrates the :first-line pseudo
element. The first line of text should use a font twice the size and
have the letter spacing set so that the text is jammed together in an
unpleasant fashion.
< / P >
< P ID = letter >
First letter style is really cool. The facility is very powerful because it
1999-02-17 17:01:39 +00:00
takes an innocuous looking content model and spices it up dramatically while
1998-10-26 17:13:28 +00:00
allowing a backwards compatible answer for older browsers.
< / P >
1998-04-15 19:23:17 +00:00
< h2 > < br >
< / h2 >
< h2 > Listings< / h2 >
< h3 > Bulleted List < / h3 >
< ul >
< li > One< / li >
< li > Two
< ul >
< li > Apples< / li >
< li > Oranges< / li >
< li > Bananas< / li >
< / ul >
< / li >
< li > Three< / li >
< / ul >
< br >
< h3 > Numbered List < / h3 >
< ol >
< li > One< / li >
< li > Two
< ol >
< li > Apples< / li >
< li > Oranges< / li >
< li > Bananas< / li >
< / ol >
< / li >
< li > Three< / li >
< / ol >
1998-10-26 17:13:28 +00:00
1998-04-15 19:23:17 +00:00
< h2 > Justified Text< / h2 >
1998-10-26 17:13:28 +00:00
< p align = left >
This paragraph is aligned < b > left< / b > .
This paragraph is aligned < b > left< / b > .
This paragraph is aligned < b > left< / b > .
This paragraph is aligned < b > left< / b > .
This paragraph is aligned < b > left< / b > .
This paragraph is aligned < b > left< / b > .
This paragraph is aligned < b > left< / b > .
< / p >
< p align = center >
This paragraph is aligned < b > center< / b > .
This paragraph is aligned < b > center< / b > .
This paragraph is aligned < b > center< / b > .
This paragraph is aligned < b > center< / b > .
This paragraph is aligned < b > center< / b > .
This paragraph is aligned < b > center< / b > .
This paragraph is aligned < b > center< / b > .
< / p >
< p align = right >
This paragraph is aligned < b > right< / b > .
This paragraph is aligned < b > right< / b > .
This paragraph is aligned < b > right< / b > .
This paragraph is aligned < b > right< / b > .
This paragraph is aligned < b > right< / b > .
This paragraph is aligned < b > right< / b > .
This paragraph is aligned < b > right< / b > .
< / p >
< p align = justify >
This paragraph is < B > justified< / B > .
This paragraph is < B > justified< / B > .
This paragraph is < B > justified< / B > .
This paragraph is < B > justified< / B > .
This paragraph is < B > justified< / B > .
This paragraph is < B > justified< / B > .
This paragraph is < B > justified< / B > .
< / p >
1998-04-13 20:24:54 +00:00
< / body >
< / html >