12 pixel base : measurement « Style Basics « HTML / CSS
- HTML / CSS
- Style Basics
- measurement
12 pixel base
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>12 pixel base</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
* {font-family:arial, verdana, sans-serif;}
#page {width:400px;}
body {font-size:100%;} /* ensure IE scales correctly */
p {font-size:0.75em;} /* 16 x 0.75 = 12 */
h1 {font-size:1.5em;} /* 16 x 1.5 = 24 */
h2 {font-size:1.3em;} /* 16 x 1.125 = 18 */
h3 {font-size:1em;} /* 16 x 1.125 = 18 */
h4 {font-size:0.875em;} /* 16 x 1.143 = 14 */
</style>
</head>
<body>
<div id="page">
<h1>Primary Heading</h1>
<p>Here is some sample text</p>
<p>Here is some sample text</p>
<h1>Secondary Heading</h1>
<p>Here is some sample text</p>
<p>Here is some sample text</p>
<p>Here is some sample text</p>
<h1>Tertiary Heading</h1>
<p>Here is some sample text</p>
<p>Here is some sample text</p>
<p>Here is some sample text</p>
<p>Here is some sample text</p>
<p>Here is some sample text</p>
</div>
</body>
</html>
Related examples in the same category