modelportfolio
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Model Portfolio template</title>
<style type='text/css'>
html, body, ul, li, h1, h2, h3, h4 {
margin: 0;
padding: 0;
list-style: none;
}
h1 img {
display: block;
}
img {
border: 0;
}
a {
color: #FEFF00;
text-decoration: underline;
}
a:hover {
}
.left {
float: left;
}
.right {
float: right;
}
.more {
text-align: right;
}
.clear {
clear: both;
}
body {
background: #581a01;
font: 12px arial, sans-serif;
color: #F09361;
}
#wrapper {
margin:auto;
position:relative;
text-align:left;
width:778px;
background: #800000 0px 135px url(modelportfolio-images/grad.jpg) repeat-x;
}
#header {
background: 6px 0 url(modelportfolio-images/header_bg.gif) repeat-x;
}
h1 {
height: 95px;
color: #fff;
font-weight: normal;
font: 22px "harrow", "Lucida Grande", arial, sans-serif;
line-height: 95px;
text-indent: 23px;
width: 400px;
}
h1 span {
font-size: 30px;
}
#body {
background: top right url(modelportfolio-images/body_bg.jpg) no-repeat;
}
#nav {
background: url(modelportfolio-images/nav_bg.gif) repeat-x;
height: 40px;
font-size: 17px;
}
#nav em {
font-size: 22px;
font-style: normal;
}
#nav ul {
min-width: 780px;
padding: 0;
padding-top: 10px;
}
#nav li {
float: left;
background: 12px 6px url(modelportfolio-images/bullet_nav.gif) no-repeat;
padding-left: 50px;
padding-right: 20px;
margin: 0;
}
#nav li.first {
background: none;
padding-left: 20px;
}
#nav a {
font-weight: normal;
color: #9A0000;
text-decoration: none;
}
#nav a:hover {
color: #500000;
}
#content {
background: #760202;
border: 1px solid #6A0101;
width: 426px;
margin: 48px 28px 8px 28px;
}
#content .i {
padding: 15px;
}
#content h2 {
font: 16px "times new roman", serif;
font-weight: normal;
color: #fff;
clear: both;
}
#content h2 strong {
color: #FEFF00;
font-weight: normal;
}
#content h2.h {
font-size: 12px;
}
.htop {
color: #FEFF00;
}
.hproject {
position: relative;
top: 0.5em;
left: -0.4em;
}
.hof {
position: relative;
top: -0.5em;
left: -1.5em;
color: #FEFF00;
}
.h2006 {
position: relative;
top: 0.1em;
left: -0.8em;
font-size: 22px;
}
#picbox-left {
margin: 1em 2em 1em 0;
background: #9A0303;
float: left;
width: 130px;
padding: 3px;
}
#picbox-left img {
display: block;
}
#gallery {
margin-top: 5px;
border: 1px solid #890202;
background: #6A0101;
padding: 5px;
margin-right: 15px;
}
#gallery img {
display: block;
}
#bigpic, #gallery .smallpic {
background: #9A0303;
padding: 4px;
}
#bigpic {
float: left;
}
#pica { margin: 0px 15px 15px 15px; }
#picb { margin: 0px 0px 15px 5px; }
#picc { margin: 0px 5px 5px 15px; }
#picd { margin: 0px 0px 5px 15px; }
.smallpic {
float: left;
}
#copyright {
text-indent: 270px;
padding-bottom: 14px;
}
#footer {
background: url(modelportfolio-images/footer.gif) repeat-x;
height: 46px;
}
</style>
</head>
<body>
<div id="wrapper">
<div id="header">
<h1><span>M</span>ODEL PORTFOLIO</h1>
</div>
<div id="nav">
<ul>
<li class="first"><a href="http://www.freewebsitetemplates.com"><em>M</em>Y BIO</a></li>
<li><a href="http://www.freewebsitetemplates.com"><em>R</em>ESUME</a></li>
<li><a href="http://www.freewebsitetemplates.com"><em>P</em>ORTFOLIO</a></li>
<li><a href="http://www.freewebsitetemplates.com"><em>P</em>HOTOS</a></li>
<li><a href="http://www.freewebsitetemplates.com"><em>C</em>ONTACTS</a></li>
</ul>
</div>
<div id="body">
<div id="content"><div class="i">
<h2><strong>Welcome</strong> to my website</h2>
<p>This is a template designed by free website templates for you for free you can replace all the text by your own
text. This is just a place holder so you can see how the site would look like.</p>
<p>You can find some <a href="http://www.webhostingservices.us/">web hosting services</a> which are also a need for website building which are listed in web hosting search.</p>
<h2 class="h"><span class="htop">TOP</span> <span class="hproject">PROJECT</span> <span class="hof">of</span> <span class="h2006">2006</span></h2>
<div id="picbox-left">
<img src="modelportfolio-images/pic_1.jpg" width="130" height="63" alt="Pic 1" />
</div>
<p>If you're looking for beautiful and professionally made templates you can find them at <a href="http://www.templatebeauty.com">Template Beauty</a>.</p>
<p>Even more websites all about website templates on <a href="http://www.justwebtemplates.com">Just Web Templates</a>.</p>
<h2><strong>My</strong> gallery</h2>
<div id="gallery">
<div id="bigpic">
<a href="http://www.freewebsitetemplates.com"><img src="modelportfolio-images/pic_2.jpg" width="180" height="112" alt="Pic 2" /></a>
</div>
<div class="smallpic" id="pica">
<a href="http://www.freewebsitetemplates.com"><img src="modelportfolio-images/pic_3.jpg" width="63" height="43" alt="Pic 3" /></a>
</div>
<div class="smallpic" id="picb">
<a href="http://www.freewebsitetemplates.com"><img src="modelportfolio-images/pic_4.jpg" width="63" height="43" alt="Pic 4" /></a>
</div>
<div class="smallpic" id="picc">
<a href="http://www.freewebsitetemplates.com"><img src="modelportfolio-images/pic_5.jpg" width="63" height="43" alt="Pic 5" /></a>
</div>
<div class="smallpic" id="picd">
<a href="http://www.freewebsitetemplates.com"><img src="modelportfolio-images/pic_6.jpg" width="63" height="43" alt="Pic 6" /></a>
</div>
<div class="clear"></div>
</div>
</div>
</div>
<div id="copyright">
Hosting by <a href="http://www.webhostingservices.us/">Web Hosting Services</a>.
</div>
</div>
<div id="footer">
</div>
</div>
</body>
</html>
Related examples in the same category