Monday, November 2, 2009

Second project file (last class)

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html><head>
<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type"><title>Sample Website</title>

<meta name="description" content="Demonstration website">
<meta name="keywords" content="sample,HTML,CSS,">
<meta name="author" content="MAS HTML class">
<style type="text/css">
html,body{margin:0;padding:0}
body{font: arial,sans-serif}
p{margin:0 10px 10px}
a{display:block;color: #006;padding:10px}
div#header{position:relative}
div#header h2{height:80px;line-height:80px;margin:0;
padding-left:10px;background: #EEE;color: #79B30B}
div#header a{position:absolute;right:0;top:23px}
div#content p{line-height:1.4}
div#navigation{background:#B9CAFF}
div#extra{background:#FF8539}
div#footer{background: #333;color: #FFF}
div#footer p{margin:0;padding:5px 10px}
div#footer a{display:inline;padding:0;color: #C6D5FD}
div#container{width:700px;margin:0 auto}
div#navigation{float:left;width:350px;height:100px;}
div#extra{float:right;width:350px;height:100px;}
div#footer{clear:both;width:100%}
</style>
</head>

<body>
<div id="container">
<div id="header">
<h2>Welcome to our sample website</h2>
</div>
<div id="content">
<p class="border">We will demonstrate a number of HTML
coding techniques,
including images, links, and styled layout.</p>
<p>Thanks for visiting!</p>
</div>
<div id="navigation">Navigation links go here</div>
<div id="extra"><a href="mailto:hce@epix.net">Email us.</a>
<a href="mailto:hce@epix.net"><img alt="" src="mail.png" height="48" width="48"></a></div>
<div id="footer">Copyright 2009</div>
</div>
<!-- close div wrapper -->
</body></html>

No comments: