//-->

yazın sanal aleminin eğlence sitesi

tasarım222

Emmm ya me gusto hacer css otro mas:

pegan este codigo por "TEXTO POR ENCIMA DE LA PAGINA":

Código:
<style type="text/css" media="screen">
<!--
body
{
font-family:  Arial Narrow;
font-size: 00px;
overflow: auto;
padding: 10px;
margin: 0px;
}

ul, li
{
list-style-type: none;
padding: 0px;
margin: 0px;
}

li a
{
padding-right: 20px;padding-top: 5px;
}

div.menu
{
position: absolute;
z-index: 3;
top: 170px;
left: 52%;
margin-left:-185px;
width: 647px;
}

.menu li
{
width: 70px;
float: left;
}

.menu a
{
border: 0px solid #xxxxxx;
background-color: #xxxxxx;
background-image: none;
text-decoration: none;
text-align: center;
font-weight: bold;
cursor: pointer;
margin: 0px;
display: 10px;
height:31px;
color: #FFFFFF;
}

.menu a:hover
{
background-color: #transparent;
background-image: none;}

#smenu1, #smenu2, #smenu3, #smenu4, #smenu5
{
font-size: 20px;
display: block;
width: 70px;
float: left;
}

#smenu1 a, #smenu2 a, #smenu3 a, #smenu4 a, #smenu5 a
{
font-weight: bold;
padding-top: 5px;
border-top: 0px;
cursor: pointer;
color: #FFFFFF;
}
//-->

</style>

<script type="text/javascript">
<!--
function montre(id)
{
with (document)
{
if (getElementById)
getElementById(id).style.display = 'block';
else if (all)
all[id].style.display = 'block';
else
layers[id].display = 'block';
}
}

function cache(id)
{
with (document)
{
if (getElementById)
getElementById(id).style.display = 'none';
else if (all)
all[id].style.display = 'none';
else
layers[id].display = 'none';
}
}
//-->
</script>
<div class="menu">

<li><a href="Pagina-Principal.htm">INICIO</a> </li>   
<li><a href="Videojuegos.htm">JUEGOS</a> </li>   
<li><a href="Videos.htm">VIDEOS</a> </li>   
<li><a href="Musica.htm">MUSICA</a> </li>   
<li><a href="Noticias.htm">NOTICIAS</a> </li>   
</div>



<div id="Designmystic">

<div id="text"><h1></h1>
</div>


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">


Este por Css-Code sin style tags:
Código:
lli.nav_element{display: none;}
li.nav_element a{display: none;}
h1#title{display: none;}
h2#title span {display: none;}



#text{
color: ffffff;
position: absolute;
top: 100px;
margin-left:-300px;
left: 50%;
}



body {
background-color:#0a0a0a;}


*{ padding: 0; margin: 0; }

#Designmystic {
margin: 0 auto;
width: 500px;
height:400px;
background-image:url(http://img49.xooimage.com/files/9/a/8/silver-copia-89c7a7.png);}

#content {
position: absolute;
left: 52%;
top: 210px;
margin-left:-310px;
width: 500px;
height: 400px;
padding:10px;
color: #000000;
font-size:13px; c
background-color:#transparent;
background-image: none;
border: 0px solid #FFFFFF;
overflow:auto;}


#Uebersicht{
position: absolute;
left: 50%;
top: 204px;
margin-left:-440px;
font-color:#cccccc;}




a{
color:#000000;
text-decoration: none;
font-size:13px;}

a:hover {
color: #000000;
font-size: 13px;
text-decoration: none;}

a:link {
color: #000000;
font-size: 13px;
text-decoration: none;}

a:active {
color: #000000;
font-size: 13px;
text-decoration: none;}

a:visited {
color: #000000;
font-size: 13px;
text-decoration: none;}          //-->
      </style>

Hola miren a aca les traigo una plantilla hecha por la mejor union de P.W.G

wedmasterayuda todobanners y nosedeqe

les deseamos que pasan una feliz navidad y que mejor forma de pasarla en sus webs que con una plantilla navideña como esta esperamos que les guste el diseño



Su codigo es

pega esto por encima de la pagina

Código:
<!-- wrap starts here -->
<div id="wrap">
      <!--header -->
      <div id="header">         
           
         <h1 id="logo-text"><a href="index.html">Encabezado</a></h1>     
         <p id="slogan">Design by Wma Tb Nsdq</p>     
         
         <div id="header-links">
         <p>
                 
         </p>     
      </div>     
                 
      </div>

     
      <!-- menu -->   
      <div  id="menu">
         <ul>
            <li id="current"><a href="Url">Link</a></li>

<li><a href="Url">LInk</a></li>
     

            <li><a href="Url">Link</a></li>
            <li class="last"><a href="Url">Link</a></li>
         </ul>
      </div>               
         
      <!-- content-wrap starts here -->
      <div id="content-wrap">
           
         <div id="sidebar">
     
            <h3>Menu</h3>
            <ul class="sidemenu">           
             

             <li><a href="Url">LInk</a></li>
              <li><a href="Url">Link</a></li>
              <li><a href="Url">LInk</a></li>
                   
            </ul>   
           
         
            <h3>Links</h3>
            <ul class="sidemenu">
   
<li><a href="Url">LInk</a></li>

<li><a href="Url">Link</a></li>
<li><a href="Url">LInk</a></li>
            </ul>
         
            <h3>texto</h3>
            <ul class="sidemenu">
               <p class="align-right"><li><a href="Url">LInk</a></li>
<li><a href="Url">Link</a></li>
<li><a href="Url">LInk</a></li></p>
           
            <h3>Texto</h3>
            <div class="left-box">
               <p class="align-right"><li><a href="Url">LInk</a></li>

<li><a href="Url">LInk</a></li></p>

               
               <p class="align-right"></p>
            </div>   
           
            <h3>texto</h3>
            <div class="left-box">
               <p class="align-right"><li><a href="Url">LInk</a></li>
</p>
            </div>                             
         </div>


Pega esto por debajo de la pagina

Código:
<!-- content-wrap ends here -->   
</div>   
<!--footer starts here-->
<div id="footer">
</div>   
<!-- wrap ends here -->
</div>


Pega esto en Css code sin Style Tags

Código:
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;}


/* Top Elements */
* { margin: 0; padding: 0; outline: 0 }

body {
   background-image:url(http://img122.imageshack.us/img122/6941/diseonavzr6.jpg);background-color:#ffffff;
   font: 70%/1.5em Verdana, Tahoma, arial, sans-serif;
   color: #000000;
   text-align: center;
}

/* links */
a, a:visited {
   text-decoration: none;
   color: #2180BC;
   background: inherit;
}
a:hover {
   color: #88ac0b;
   background: inherit;
   text-decoration: underline;
}

/* headers */
h1, h2, h3 {
   font-family: 'Trebuchet MS', Tahoma, Sans-serif;         
}
h1 {
   font-size: 50%;   
   font-weight: normal;
   color: #ffffff;
}
h2 {
   font-size: 40%;
   text-transform: uppercase;
   color: #ffffff;
}
h3 {
   font-size: 50%;
   color: #ffffff;
}

h1, h2, h3, p {
   padding: 10px;     
   margin: 0;
}
ul, ol {
   margin: 5px 20px;
   padding: 0 20px;
}


/********************************************
  Design
********************************************/
#wrap {
   width: 750px;
   background:  url(http://www.fileden.com/files/2008/5/22/1925126/wedmasterayudaboxcentral.jpg ) repeat-y center top;
   margin: 0 auto;
   text-align: left;
}
#content-wrap {
   clear: both;
   width: 750px;
   padding: 0;
   margin: 10px auto;
}
#header {
   width: 980px;
   position: relative;
   height: 180px;
   background: #000000 url(http://pixelea.com/s/a7017deeed.png
) no-repeat center top;
   padding: 0;   
   
}
#header h1#logo-text a {
   position: absolute;
   margin: 0; padding: 0;
   font: bolder 44px 'Trebuchet MS', Arial, Sans-serif;
   letter-spacing: -2px;
   color: #ffffff;
   text-transform: none;
   text-decoration: none;
   background: transparent;
   
   /* change the values of top and left to adjust the position of the logo*/
   top: 25px; left: 10px;   
}
#header p#slogan {
   position: absolute;
   margin: 0; padding: 0;
   font: normal 12px 'Trebuchet MS', Arial, Sans-serif;
   text-transform: none;
   color: #ffffff;
   
   /* change the values of top and left to adjust the position of the slogan*/
   top: 70px; left: 10px;     
}

/* header links */
#header #header-links {
   position: absolute;
   top: 20px; right: 15px;   
   color: #ffffff;
   font-size: 10px;   
}
#header #header-links a {   
   color: #ffffff;
   text-decoration: none;   
}
#header #header-links a:hover {
   color: #00ccff;   
}

/* Menu */
#menu {
   clear: both;   
   margin: 0 auto; padding: 0;
   background: url(http://www.fileden.com/files/2008/5/22/1925126/wedmasterayudabarra9.png) repeat-x 0 0;   
   font: bold 12px/37px Verdana, Arial, Tahoma, Sans-serif;
   height: 28px;
   width: 725px;
}
#menu ul {
   float: right;
   list-style: none;
   margin:0; padding: 0;
}
#menu ul li {
   display: inline;
}
#menu ul li a {
   display: block;
   float: left;
   padding: 0 12px;
   color: #ffffff;   
   text-decoration: none;
}
#menu ul li.last a {
   padding-right: 20px;   
}
#menu ul li a:hover {
   color: #ffffff;   
}
#menu ul li#current a {   
   color: #bc0303;
}

/* Main Column */
#main {
   float: left;
   width: 70%;
   padding: 0; margin: 5px 0 0 5px;
   display: inline;
}
#main h2 {
   margin-top: 10px;
   font: Bold 140% 'Trebuchet MS', Tahoma, Sans-serif;
   color: #000000;
   padding: 5px 0 5px 25px;   
   border-bottom: 1px solid #EFF0F1;
   background: #FFF none no-repeat 3px 50%;   
   text-transform: none;
}
#main h2 a {
   background: none;
   color: #88ac0b;
   text-decoration: none;
}

#main ul li {
   list-style-image: none;
}

.post-footer {
   background-color: #000000;
   padding: 5px; margin: 20px 10px 10px 10px;
   border: 1px solid #f2f2f2;
   font-size: 95%;   
}
.post-footer .date {
   background: none no-repeat left center;
   padding-left: 20px; margin: 0 10px 0 5px;
}
.post-footer .comments {
   background: none no-repeat left center;
   padding-left: 20px; margin: 0 10px 0 5px;
}
.post-footer .readmore {
   background: none no-repeat left center;
   padding-left: 20px; margin: 0 10px 0 5px;
}

/* Sidebar */   
#sidebar {
   float: right;
   width: 26.5%;
   padding: 0; margin: 0;   
   color: #ffffff;   
       
}   
#sidebar h3 {
   margin-top: 10px;
   padding: 20px 20px;
   font: bold 1.4em 'Trebuchet MS', Tahoma, Sans-serif;
   color: #bc0303;   
}
#sidebar ul.sidemenu {
   list-style: none;
   text-align: left;
   margin: 7px 4px 8px 0; padding: 0;
   text-decoration: none;     
   background: none repeat-x left top;
}
#sidebar ul.sidemenu li {
   list-style: none;
   background: none repeat-x left bottom;
   padding: 4px 0 4px 5px;
   margin: 0 20px;   
   color: #bc0303;   
}
* html body #sidebar ul.sidemenu li {
   height: 1%;
}
#sidebar ul.sidemenu li a {
   text-decoration: none;   
   background-image: none;   
   color: #000000;         
}
#sidebar ul.sidemenu li a:hover {   
   color: #bc0303;   
}
#sidebar ul.sidemenu ul { margin: 0 0 0 5px; padding: 0; }
#sidebar ul.sidemenu ul li { background: none; }


/* Footer */   
#footer {
   color: #ffffff;
   background:  url() no-repeat center top;
   clear: both;
   width: 838px;
   height: 76px;
   text-align: center;   
   font-size: 92%;   
}
#footer a {
   color: #FFF;
   text-decoration: none;
}

/* alignment classes */
.float-left  { float: left; }
.float-right { float: right; }
.align-left  { text-align: left; }
.align-right { text-align: right; }

/* display and additional classes */
.clear { clear: both; }
Bu web sitesi ücretsiz olarak Bedava-Sitem.com ile oluşturulmuştur. Siz de kendi web sitenizi kurmak ister misiniz?
Ücretsiz kaydol