Civilized
Vista previa: img86.imageshack.us/img86/711/civilized.pngTexto por encima de la página:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!--
Design by Free CSS Templates
http://www.freecsstemplates.org
Released for free under a Creative Commons Attribution 2.5 License
-->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Civilized by Free CSS Templates</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<link href="default.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="outer">
<div id="header">
<h1><a href="#">Civilized</a></h1>
<h2>by Free CSS Templates</h2>
</div>
<div id="menu">
<ul>
<li class="first"><a href="#" accesskey="1" title="">Home</a></li>
<li><a href="#" accesskey="2" title="">About Us</a></li>
<li><a href="#" accesskey="3" title="">Products</a></li>
<li><a href="#" accesskey="4" title="">Services</a></li>
<li><a href="#" accesskey="5" title="">Contact Us</a></li>
</ul>
</div>
<div id="content">
<div id="primaryContentContainer">
<div id="primaryContent">
<h2>Welcome to Sitename.com!</h2>
Texto por debajo de la página:
</td>
</tr>
</table>
</div>
</div>
<div id="secondaryContent">
<h3>Etiam suscipit et</h3>
<p>Rhoncus ac, lacinia, nisl. Aliquam gravida massa eu arcu. <a href="#">More…</a></p>
<h3>Fusce dolor tristique</h3>
<p>Sed eu eros imperdiet eros interdum blandit. Vivamus sagittis bibendum erat. Curabitur malesuada. <a href="#">More…</a></p>
<h3>Nunc pellentesque</h3>
<p>Sed vestibulum blandit nisl. Quisque elementum convallis purus. Suspendisse potenti. Donec nulla est, laoreet quis, pellentesque in. <a href="#">More…</a></p>
<h3>Ipsum Dolorem</h3>
<ul>
<li><a href="#">Sagittis Bibendum Erat</a></li>
<li><a href="#">Malesuada Turpis</a></li>
<li><a href="#">Quis Gravida Massa</a></li>
<li><a href="#">Inerat Viverra Ornare</a></li>
</ul>
</div>
<div class="clear"></div>
</div>
<div id="footer">
<p>Adaptado por ayuda para pwg - www.foro-ayudaparapwg.es.tl</p>
</div>
</div>
</body>
</html>
CSS-Code sin Style Tags:
lli.nav_element{display: none;}
li.nav_element a{display: none;}
h1#title{display: none;}
h2#title span {display: none;}
div.header{display: none;}
li.nav_element{list-style-type: none;}
li.nav_element{display: none;}
/*
Design by Free CSS Templates
http://www.freecsstemplates.org
Released for free under a Creative Commons Attribution 2.5 License
*/
/* Basic */
*
{
margin: 0em;
padding: 0em;
}
h1,h2
{
}
a
{
color: #995500;
}
body
{
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
font-size: 11pt;
background: #fff;
color: #665555;
}
/* Outer */
#outer
{
margin: 0em auto 1em auto;
width: 100%;
background-color: #fff;
}
/* Header */
#header
{
padding: 1.5em 2em 1.5em 4em;
background: #2E2017 url('http://img40.xooimage.com/files/5/7/4/a1-1426994.jpg') top left repeat-x;
}
#header h1
{
font-size: 2.0em;
}
#header h1, #header h2
{
display: block;
width: 778px;
margin: 0em auto;
}
#header h1 a
{
color: #fff;
text-decoration: none;
}
#header h2
{
color: #bbaa77;
font-size: 0.8em;
}
/* Menu */
#menu
{
padding: 1em 2em 1em 0em;
background: #F1DFC9 url('http://img40.xooimage.com/files/8/e/c/a2-14269a7.gif') top left repeat-x;
font-size: 0.9em;
}
#menu ul
{
display: block;
width: 778px;
margin: 0em auto;
list-style: none;
padding-left: 2.5em;
}
#menu li
{
display: inline;
}
#menu li a
{
color: #38271C;
font-weight: bold;
text-decoration: none;
padding: 0.25em 0.75em 0.25em 0.75em;
}
#menu li a:hover
{
background: #342117 url('http://img46.xooimage.com/files/7/2/3/a4-14269ea.gif') top left repeat-x;
color: #fff;
}
/* Content */
#content
{
width: 778px;
margin: 0em auto;
}
#content p
{
margin-bottom: 1.5em;
text-align: justify;
}
#content h2,h3,h4,h5,h6
{
color: #443333;
margin-bottom: 1em;
}
#content ul
{
margin-bottom: 1.5em;
padding-left: 1em;
}
#content blockquote
{
padding-left: 1em;
margin-bottom: 1.5em;
border-left: solid 7px #EFEECC;
}
#content blockquote p
{
margin-bottom: 0em;
}
#content table
{
margin-bottom: 1.5em;
}
#content table th
{
text-align: left;
font-weight: bold;
padding: 0.5em;
color: #443333;
}
#content table td
{
padding: 0.5em;
}
#content table tr.rowA
{
background-color: #F6EECC;
color: inherit;
}
#content table tr.rowB
{
background-color: #FFFEEF;
color: inherit;
}
/* Primary Content */
#primaryContentContainer
{
float: left;
margin-left: -17em;
width: 100%;
}
#primaryContent
{
margin: 0em 0em 0em 16.5em;
padding: 1.5em;
}
#primaryContent h2, #primaryContent h3
{
border-bottom: solid 1px #efeecc;
padding-bottom: 0.25em;
margin-bottom: 1.25em;
}
#primaryContent h2
{
font-size: 1.7em;
}
#primaryContent h3
{
font-size: 1.1em;
}
/* Secondary Content */
#secondaryContent
{
float: right;
width: 14em;
padding: 1.5em 2em 1.5em 2em;
font-size: 0.9em;
}
#secondaryContent h3
{
background: #2E2017 url('http://img46.xooimage.com/files/7/2/3/a4-14269ea.gif') top left repeat-x;
color: #fff;
padding: 0.5em;
padding: 0.5em 0.5em 0.5em 1.0em;
position: relative;
left: -0.8em;
margin-right: -1.6em;
font-size: 1.0em;
}
/* Footer */
#footer
{
padding: 1.5em 2em 1.5em 2em;
text-align: center;
width: 778px;
margin: 0em auto;
border-top: solid 1px #efeecc;
font-size: 0.9em;
}
.clear
{
clear: both;
}