highwaycss
<!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">
<head>
<title>Highway</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type='text/css'>
* {
margin: 0px;
padding: 0px;
}
body {
background-image: url(highwaycss-images/Pettern01.jpg);
background-repeat: repeat;
text-align: center;
font-family: 'Trebuchet MS', Helvetica, 'Helvetica Neue', Tahoma, sans-serif;
font-size: 12px;
}
#outdiv {
background-image: url(highwaycss-images/hbg.jpg);
background-repeat: repeat-x;
background-position: top;
}
#wrap {
width: 702px;
margin-right: auto;
margin-left: auto;
}
#header {
position: relative;
height: 180px;
width: 100%;
top: 0px;
background-image: url(highwaycss-images/nav.jpg);
background-repeat: no-repeat;
background-position: bottom;
}
.logo {
background-image: url(highwaycss-images/Logo.jpg);
background-repeat: no-repeat;
height: 90px;
width: 290px;
position: absolute;
left: 0px;
top: 0px;
display: block;
}
#nav {
position: absolute;
bottom: 40px;
text-align: center;
height: 20px;
width: 100%;
left: 0px;
}
#nav ul {
list-style-type: none;
font-size: 16px;
line-height: 20px;
}
#nav ul li {
display: inline;
}
#nav ul li a {
font-weight: bold;
color: #FFFFFF;
text-decoration: none;
margin-right: 20px;
margin-left: 20px;
text-transform: uppercase;
}
#nav ul li a:hover {
color: #d8a82d;
}
#main {
background-image: url(highwaycss-images/Pettern02.jpg);
background-repeat: repeat;
border: 1px solid #515151;
text-align: left;
padding: 10px;
color: #FFFFFF;
}
#main a {
color: #cfb429;
text-decoration: none;
}
#outfooter {
background-image: url(highwaycss-images/footer1.jpg);
background-repeat: repeat-x;
background-position: top;
text-align: center;
}
#footer {
width: 702px;
margin-right: auto;
margin-left: auto;
background-image: url(highwaycss-images/footer2.jpg);
background-repeat: no-repeat;
background-position: top;
text-align: right;
padding-top: 40px;
color: #FFFFFF;
}
#footer a {
color: #FFFFFF;
text-decoration: none;
font-weight: bold;
}
#footer a:hover {
text-decoration: underline;
}
h1,h2,h3 {
color: #cfb429;
padding-top: 3px;
padding-bottom: 3px;
border-bottom-width: 1px;
border-bottom-style: dotted;
border-bottom-color: #cfb429;
text-transform: uppercase;
}
h1 {
font-size: 2.2em;
}
h2 {
font-size: 1.8em;
}
h3 {
font-size: 1.4em;
}
</style>
</head>
<body>
<div id="outdiv">
<div id="wrap">
<div id="header"><a href="http://www.free-css.com/" class="logo"></a>
<div id="nav">
<ul>
<li><a href="http://www.free-css.com/">Home</a></li>
<li><a href="http://www.free-css.com/">Blog</a></li>
<li><a href="http://www.free-css.com/">About us</a></li>
<li><a href="http://www.free-css.com/">Contact</a></li>
</ul>
</div>
</div>
<div id="main">
<h1>Heading 1</h1>
<p>This template is created by PHPLD Templates and sponsored by Aviva Directory. You are free to use it if you agree not to remove links to those 2 sites in footer and keep them intact. If you want to remove links, please read Read me file included in zip file.</p>
<p>Matching template for PHP Link Directory script 2.0 vesion(free) can be also downloaded free at PHPLD Templates.</p>
<p>Original psd file for logo and font used are also included in zip file, so you can change logo to match your site name. If you use this template, let us know at hemikalije@gmail.com. We would really like to see it in action. </p>
<h2>Heading 2</h2>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore <a href="http://www.free-css.com/">magna aliquyam</a> erat, sed diam voluptua.</p>
<h3>Heading 3</h3>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore <a href="http://www.free-css.com/">magna aliquyam</a> erat, sed diam voluptua.</p>
</div>
</div>
<div id="outfooter">
<div id="footer">
<p>Copyright <a href="http://www.free-css.com/">Yoursite.com</a> ©2006. Design by <a href="http://www.phpldtemplates.info">PHPLD Templates</a>.</p>
</div>
</div>
</div>
</body>
</html>
Related examples in the same category