<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<title>CSS1 Font Properties Example</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<style type="text/css">
body {font-size: 14pt;}
.serif {font-family: serif;}
.sans-serif {font-family: sans-serif;}
.cursive {font-family: cursive;}
.fantasy {font-family: fantasy;}
.comic {font-family: Comic Sans MS;}
.xx-small {font-size: xx-small;}
.x-small {font-size: x-small;}
.small {font-size: small;}
.medium {font-size: medium;}
.large {font-size: large;}
.x-large {font-size: x-large;}
.xx-large {font-size: xx-large;}
.smaller {font-size: smaller;}
.larger {font-size: larger;}
.points {font-size: 18pt;}
.percentage {font-size: 200%;}
.italic {font-style: italic;}
.oblique {font-style: oblique;}
.weight {font-weight: 900;}
.smallcaps {font-variant: small-caps;}
</style>
</head>
<body>
<h2>Font Family</h2>
This text is in <span class="serif">Serif.</span><br />
This text is in <span class="sans-serif">Sans-Serif.</span><br />
This text is in <span class="cursive">Cursive.</span><br />
This text is in <span class="fantasy">Fantasy.</span><br />
Actual fonts can be specified like
<span class="comic">Comic Sans MS</span><br />
<h2>Font Sizing</h2>
This is <span class="xx-small">xx-small text.</span><br />
This is <span class="x-small">x-small text.</span><br />
This is <span class="small">small text.</span><br />
This is <span class="medium">medium text.</span><br />
This is <span class="large">large text.</span><br />
This is <span class="x-large">x-large text.</span><br />
This is <span class="xx-large">xx-large text.</span><br />
This is <span class="smaller">smaller text</span>than the rest.<br />
This is <span class="larger">larger text</span>than the rest.<br />
This is <span class="points">exactly 18 point text.</span><br />
This is <span class="percentage">200% larger text.</span><br />
<h2>Font Style, Weight, and Variant</h2>
This text is <span class="italic">italic.</span><br />
This text is <span class="oblique">oblique.</span><br />
This text is <span class="weight">bold.</span><br />
This text is in <span class="smallcaps">smallcaps.</span><br />
</body>
</html>