A Style Sheet h1

A Style Sheet h1

A Style Sheet h1

A Style Sheet h1

For this page I have included a 25 pixel left margin. Made the Font for the entire page Helvetica, put a mild yellow background color, and changed the color of the font to dark blue. The quick brown fox jumped over the lazy brown dog. The quick brown fox jumped over the lazy brown dog. The quick brown fox jumped over the lazy brown dog. The quick brown fox jumped over the lazy brown dog. The quick brown fox jumped over the lazy brown dog. The quick brown fox jumped over the lazy brown dog. The quick brown fox jumped over the lazy brown dog. The quick brown fox jumped over the lazy brown dog. The quick brown fox jumped over the lazy brown dog. Changed the H1 to 30 pt, Arial Italic

Header h2

Second level header.

Header h3

Third level header.

Header h4

Fourth level header.

Header h5

Fifth level header.

Header h6

Standard paragraph

Notice the first seven are block level elements, they each appear on a different line. The next three are all on the same line. They are inline elements. This will be important later. Remember the difference.

This text is bold. This text is italic. Tis text is big. This text is small.

The style sheet looks like this...

body
	{
	background-color: #ffffef;
	margin-right: 25px;
	margin-left: 50px;
	font-family: Helvetica;
	color: #000099;
	}
.balance
	{
	position: absolute;
	top: 400;
	}
		
h1.header1
	{
	position: absolute;
	left: 150;
	top: 100;
	color: #009900;
	}		 
h1.header2
	{
	position: absolute;
	left: 155;
	top: 95;
	color: #990000;
	}		 
h1.header3
	{
	position: absolute;
	left: 160;
	top: 100;
	color: #000099;
	}		 
h1.header4
	{
	position: absolute;
	left: 155;
	top: 110;
	color: #0000ff;
	}		 
h1	
	{
	font-size: 72pt;
	text-align: center;
	}		
h2	
	{
	font-size: 42pt;
	text-align: justified;
	}		
h3	
	{
	font-size: 20pt;
	}		
	
p.indent
	{
	text-indent: 35px;
	text-align: justify;
	background-color: #ff9;
	padding: 8px;
	}		
a:link
	{
	text-decoration: none;
	color: #800;
	}	
a:active
	{
	text-decoration: none;
	color: #0f0;
	}	
a:visited
	{
	text-decoration: none;
	color: #800;
	}	
a:hover
	{
	text-decoration: underline;
	color: #800;
	}

The above is CSS formatted. Now let's look at the same page with CSS Image positioning added. CSS Page