dasr pruebas

creadaporestilocss

POR ARRIBA:

<!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' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>

<div class='navbar section' id='navbar'>
<div class='widget Navbar' id='Navbar1'></div>
<div id='layout_wrapper'>
<div id='layout_edgetop'></div>
<div id='layout_container'>



<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js' type='text/javascript'/></script>
<script src='http://dl.dropbox.com/u/647003/CiudadBlogger/Scripts/jqueryslidemenu.js' type='text/javascript'/></script>
<div id="myslidemenu2"
class="jqueryslidemenu2">
<ul>
<li><a href="#">Link 1</a></li>
<li><a href="#">Link 2</a></li>
<li><a href="#">Link 3</a></li>
</ul>

</div>

<div class='clear'></div>


<div id='header-wrapper'>
<div style="
padding-left: 580px;
">
<a href="http://twitter.com/estilocss"><img src="http://img690.imageshack.us/img690/6821/twitterdk.png" border="0"></a>
</div>
<div style="
padding-left: 650px;
margin-top: -50px;
">
<a href=""><img src="http://img510.imageshack.us/img510/5229/facebookd.png"></a>
</div>
<div class='header section' id='header'><div class='widget Header' id='Header1'>
<div id='header-inner'><div class='titlewrapper'>

</div>

</div>
</div></div>

<div class='clear'></div>
</div>



<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js' type='text/javascript'/></script>
<script src='http://dl.dropbox.com/u/647003/CiudadBlogger/Scripts/jqueryslidemenu.js' type='text/javascript'/></script>
<div id="myslidemenu"
class="jqueryslidemenu">
<ul>
<li><a href="#">Pestaña 1</a></li>
<li><a href="#">Pestaña 2</a></li>
<li><a href="#">Pestaña 3</a>
<ul>
<li><a href="#">Sub 3.1</a></li>
<li><a href="#">Sub 3.2</a>
<ul>
<li><a href="#">Sub 3.2.1</a></li>
<li><a href="#">Sub 3.2.2</a></li>
<li><a href="#">Sub 3.2.3</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="#">Pestaña 4</a></li>
<li><a href="#">Pestaña 5</a>
<ul>
<li><a href="#">Sub 5.1</a></li>
<li><a href="#">Sub 5.2</a></li>
<li><a href="#">Sub 5.3</a></li>
<li><a href="#">Sub 5.4</a></li>
</ul>
</li>
<li><a href="#">Pestaña 6</a></li>
</ul>

</div>

<div id='top_separator'></div>
<div id='navigation'>
<div id='tabs'>

</div>
<div class='spacer h5'></div>
<div id='content-wrapper'>

POR ABAJO:

<div id='sidebar'>
<div class='widget' id='search'>
<div>


<h2><img src="http://wimg.co.uk/jTJ.png"> Box de contenido 1</h2>
<div class='widget-content'>

<center><a href="#"><img src="http://www.elegantthemes.com/preview/InterPhase/wp-content/themes/InterPhase/images/125x125.gif"><a href="#"><img src="http://www.elegantthemes.com/preview/InterPhase/wp-content/themes/InterPhase/images/125x125.gif">
<br />
<a href="#"><img src="http://www.elegantthemes.com/preview/InterPhase/wp-content/themes/InterPhase/images/125x125.gif"><a href="#"><img src="http://www.elegantthemes.com/preview/InterPhase/wp-content/themes/InterPhase/images/125x125.gif"></center></a>
<br />


</div></div>
<div class='widget BlogArchive'>


<h2><img src="http://wimg.co.uk/jTJ.png"> Box de contenido 2</h2>
<div class='widget-content'>
Mas contenido o poner vinculos:<br />
-<a href="#">vinculo1<a/><br />
-<a href="#">vinculo2<a/><br />
-<a href="#">vinculo3<a/><br />
-<a href="#">vinculo4<a/><br />



<div id='ArchiveList'>
<div id='BlogArchive1_ArchiveList'>
</div></div>
<span class='widget-item-control'></div>
</div></div></div>

<div class='clear'></div></div>

<div id='footer'>
Copyright © 2011<a href=' http://dasr.es.tl/ '>dasr.es.tl</a> |
| Diseño creado y elaborado por: <b><u>jmtemplates</u></b>
</div>
</div>
<div id='layout_edgebottom'></div>
</div>

CSS:

<---Desing creado por estilo-css--->

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;}

* {
margin: 0;
padding: 0;
}

body {
background: url(http://www.picalls.com/1024x768/1024x768.php?src=/02/./data/media/11/Tetraedros.jpg&w=1024&h=768&zc=0) no-repeat;
background-attachment: fixed;
font: normal 13px Verdana;
color: #000;
padding-bottom: 1em;
}

a {
color: #0066AA;
}

a:hover {
color: #003366;
}

p {
padding: 0.1em 0 0.8em;
}

h1 {
font: normal 1.8em Georgia,Tahoma,sans-serif;
}

h2 {
font: normal 1.5em Georgia,sans-serif;
}

h3 {
font: bold 1em Tahoma,sans-serif;
}

html {
height: 100%;
padding-bottom: 1px;
}

ul,ol {
margin: 0 0 1em 1.6em;
}
ul ul, ol ol {
margin: 0.3em 0 0.3em 1em;
}
img {
border: none;
}

img.bordered {
background: #FFF;
padding: 5px;
border: 1px solid #DDD;
}

img.left {
margin-right: 1em;
}

img.right {
margin-left: 1em;
}

small,.small {
font-size: 0.8em;
}

big,.big {
font-size: 1.2em;
}

#layout_wrapper {
margin: 10px auto 0;
width: 1024px;
}

#layout_container {
background: #FFF;
border: 2px solid #323232;
margin: 5px;
}

#layout_edgetop, #layout_edgebottom {
background: url(BARRA SOBRE HEADER) no-repeat left top;
display: block;
height: 10px;
font-size: 0;
line-height: 0;
}

#layout_edgebottom {
background-position: left bottom;
}

/*-- (Cabecera) --*/
#header-wrapper {
background: url(http://img707.imageshack.us/img707/8006/headergx.png) no-repeat;
width: 1012px;
height: 140px;

}
#header-wrapper h1 {
font: normal 2.4em sans-serif;
letter-spacing: -1px;
color: #507A9A;
float:left;
}
#header-wrapper h1 a {
color: #507A9A;
text-decoration: none;
}
#header-wrapper h1 a:hover {
color: #305A7A
}
#header-wrapper p {
padding: 1.4em 0 0;
font: normal 1.1em sans-serif;
color: #667799;
float:right;
}

#layout_edgebottom {
background-position: left bottom;
}

/*-- (Contenedor) --*/
.h5 {
height: 0px;
}

/* Contenido */
#content {
background: #FFFFFF;
width: 675px;
float: left;
margin: 5px;
padding: 10px 10px 5px;
}
#content a {
}
#content a:hover {
}

.date-header {
color: #999999;
padding-top: 1px;
font-size: 0.85em;
float:right;
}
.post-footer, p.comment-footer {
padding: 4px 5px 3px;
background: #F5F5F5;
color: #666;
border-top: 1px solid #E5E5E5;
font-size: 0.8em;
}
.post-footer a{
color: #567;
}
.post-footer a:hover{
color: #002;
}
.post-footer .comment-link {
background: none no-repeat left center;
padding-left: 18px;
float:right;
}
.post_bottom {
background: url(BARRA ABAJO DE FOOTER) no-repeat left top;
display: block;
height: 5px;
font-size: 0;
line-height: 0;
}
.feed-links {display:none;}
.blog-pager {margin:10px 0; font-size:0.8em;}

/* Sidebar */
#sidebar {
background: #FFF;
float:right;
width: 290px;
border-left: #DDD solid 0.1em;
padding: 0px 0px 10px;
}
#sidebar ul{
margin-left: 0;
}
#sidebar li{
list-style: none;
padding: 4px;
}
#sidebar li:first-child {
border-top: none;
}

#sidebar li a{
text-decoration: none;
}

#sidebar li a:hover{
text-decoration: underline;
}

#sidebar h2 {
background: url(http://img525.imageshack.us/img525/7360/menu2q.png);
border-top: #DDD solid 0.1em;
border-bottom: #DDD solid 0.1em;
padding: 6px 10px 5px;
font-weight: bold;
font-size: 1em;
color: #000;
font-style: arial;
display:block;
}

#sidebar .widget-content {
background: #FFFFF0 repeat-x left top;
padding: 8px 10px 1px;
font-size: 0.9em;
}
#sidebar .widget {
padding-bottom: 5px;
background: none no-repeat left bottom;
background-position: center;
margin-bottom:5px;
}

/*-- Footer --*/
#footer {
background: #FFF;
border-top: 1px solid #C0C0C0;
padding: 6px;
font-size: 0.85em;
color: #000;
text-align:center;
}

#footer {
color: #000;
padding: 12px 18px 6px;
}

#footer a {
color: #000;
text-decoration: none;
}

#footer a:hover {
color: #3d7a2c;
text-decoration: underline;
}

.left {
float: left;
}

.right {
float: right;
}

.clear,.clearer {
clear: both;
}

.clearer,.spacer {
display: block;
font-size: 0;
line-height: 0;
}

/*-- Menu --*/
.jqueryslidemenu{
font: bold 12px Verdana;
background: url(http://img525.imageshack.us/img525/7360/menu2q.png) repeat-x;
border-bottom: 1px solid #C0C0C0;
height: 30px;
width: 1010px;
}

.jqueryslidemenu ul{
margin: 0;
padding: 0;
list-style-type: none;
}

/*Top level list items*/
.jqueryslidemenu ul li{
position: relative;
display: inline;
float: left;
}

/*Top level menu link items style*/
.jqueryslidemenu ul li a{
display: block;
background: url(http://img525.imageshack.us/img525/7360/menu2q.png) repeat-x ; /*background of tabs (default state)*/
padding: 8px 10px;
color: white;
border-right: 1px solid #C0C0C0;
color: #2d2b2b;
text-decoration: none;
}

* html .jqueryslidemenu ul li a{ /*IE6 hack to get sub menu links to behave correctly*/
display: inline-block;
}

.jqueryslidemenu ul li a:link, .jqueryslidemenu ul li a:visited{
color: black;
}

.jqueryslidemenu ul li a:hover{
background: white; /*tab link background during hover state*/
color: #000;
}

/*1st sub level menu*/
.jqueryslidemenu ul li ul{
color: #383026;
position: absolute;
left: 0;
display: block;
visibility: hidden;
}

/*Sub level menu list items (undo style from Top level List Items)*/
.jqueryslidemenu ul li ul li{
display: list-item;
float: none;
}

/*All subsequent sub menu levels vertical offset after 1st level sub menu */
.jqueryslidemenu ul li ul li ul{
top: 0;
}

/* Sub level menu links style */
.jqueryslidemenu ul li ul li a{
font: normal 13px Verdana;
width: 160px; /*width of sub menus*/
padding: 5px;
margin: 0;
border-top-width: 0;
border-bottom: 1px solid gray;
}

.jqueryslidemenuz ul li ul li a:hover{ /*sub menus hover style*/
background: #eff9ff;
color: #383026;
}

/* ######### CSS classes applied to down and right arrow images ######### */

.downarrowclass{
position: absolute;
top: 12px;
right: 7px;
}

.rightarrowclass{
position: absolute;
top: 6px;
right: 5px;
}

#postit{
position:absolute;
width: 590px;
height: 70px;
background: url(http://wimg.co.uk/kRn.png);
padding: 1px 4px 7px;
margin: 2px;
visibility:hidden;
z-index:500;
cursor:hand;
}

/*-- Arriba --*/
.jqueryslidemenu2{
font: bold 12px Verdana;
background: #323232;
height: 24px;
width: 1010px;
}

.jqueryslidemenu2 ul{
margin: 0;
padding: 0;
list-style-type: none;
}

/*Top level list items*/
.jqueryslidemenu2 ul li{
position: relative;
display: inline;
float: left;
}

/*Top level menu link items style*/
.jqueryslidemenu2 ul li a{
display: block;
background: #323232 repeat-x ; /*background of tabs (default state)*/
padding: 5px 7px;
color: white;
color: #2d2b2b;
text-decoration: none;
}

* html .jqueryslidemenu2 ul li a{ /*IE6 hack to get sub menu links to behave correctly*/
display: inline-block;
}

.jqueryslidemenu2 ul li a:link, .jqueryslidemenu2 ul li a:visited{
color: white;
}

.jqueryslidemenu2 ul li a:hover{
background: #323232; /*tab link background during hover state*/
color: #white;
}

/*1st sub level menu*/
.jqueryslidemenu ul li ul{
color: #FFF;
position: absolute;
left: 0;
display: block;
visibility: hidden;
}

/*Sub level menu list items (undo style from Top level List Items)*/
.jqueryslidemenu ul li ul li{
display: list-item;
float: none;
}

/*All subsequent sub menu levels vertical offset after 1st level sub menu */
.jqueryslidemenu ul li ul li ul{
top: 0;
}

/* Sub level menu links style */
.jqueryslidemenu ul li ul li a{
font: normal 13px Verdana;
width: 160px; /*width of sub menus*/
padding: 5px;
margin: 0;
border-top-width: 0;
border-bottom: 1px solid gray;
}

.jqueryslidemenuz ul li ul li a:hover{ /*sub menus hover style*/
background: #eff9ff;
color: #383026;
}

/* ######### CSS classes applied to down and right arrow images ######### */

.downarrowclass{
position: absolute;
top: 12px;
right: 7px;
}

.rightarrowclass{
position: absolute;
top: 6px;
right: 5px;
}

creadaporestilocss

Submenu

Publicidad