Colorful

Encima de la pagina 
Código:
<body> 
<div class="wrapper"> 
  <!-- Start Border--> 
  <div id="border"> 
       <!-- Start Navigation Bar --> 
    <div id="nav-bar"> 
      <ul> 
        <li><P ALIGN=right><a href="#"><br><img src="http://i51.tinypic.com/mm7s4j.gif"; onmouseover="this.src='http://i56.tinypic.com/2ho9zl0.jpg';" onmouseout="this.src='http://i51.tinypic.com/mm7s4j.gif';"> </a> 
<a href="#"> <img src="http://i55.tinypic.com/wi9c90.gif"; onmouseover="this.src='http://i55.tinypic.com/15s0nq0.gif';" onmouseout="this.src='http://i55.tinypic.com/wi9c90.gif';"> </a>      <a href="#"><img src="http://i55.tinypic.com/idc1sw.gif"; onmouseover="this.src='http://i52.tinypic.com/2nav52t.gif';" onmouseout="this.src='http://i55.tinypic.com/idc1sw.gif';"></a>      <a href="#"> <img src="http://i55.tinypic.com/j83c5l.gif"; onmouseover="this.src='http://i56.tinypic.com/2r5gi9f.gif';" onmouseout="this.src='http://i55.tinypic.com/j83c5l.gif';"> </a>       <a href="#"> <img src="http://i51.tinypic.com/15dvqe9.gif"; onmouseover="this.src='http://i55.tinypic.com/15yyxsh.gif';" onmouseout="this.src='http://i51.tinypic.com/15dvqe9.gif';"> </a>.</ul> 
    </div> 
    <!-- End Navigation Bar --> 
    <!-- Start Left Column --> 
    <div id="leftcolumn"> 
      <!-- Start Box --> 
      <div class="in-the-news"> 
       <div class="left-heading"><img src="http://i52.tinypic.com/zkiwck.gif"> </div> 
        <div class="left-mid"> Escribee lo que quieras, texto aqui texto aqui texto aqui texto aqui texto aqui texto aqui texto aqui texto aqui texto aqui texto aqui texto aqui texto aqui texto aqui texto aqui texto aqui texto aqui texto aqui texto aqui texto aqui texto aqui texto aqui texto aqui.</div> 
        
      </div> 
      <!-- End Box --> 
      <!-- Start Box --> 
      <div class="in-the-news"> 
        <div class="left-heading"> <img src="http://i54.tinypic.com/eq35fb.gif"> </div> 
        <div class="left-mid">Diseño adaptado por desingics.es.tl porfavor deja los creditos !,</div> 
            </div> 
      <!-- End Box --> 
      <!-- Start Box --> 
      <div class="in-the-news"> 
        <div class="left-heading"><img src="http://i56.tinypic.com/2ln8nbn.gif"></div> 
        <div class="left-mid"> 
          <ul id="daily-links"> 
            <li><a href="/Menu1.htm">Menu1</a></li> 
            <li><a href="/Menu2.htm"> Menu2</a></li> 
            <li><a href="/Menu3.htm"> Menu3</a></li> 
            <li><a href="/Menu4.htm"> Menu4</a></li> 
            <li><a href="/Menu7.htm"> Menu5</a></li> 
            <li><a href="/Menu6.htm"> Menu6</a></li> 
            <li><a href="/Menu7.htm"> Menu7</a></li> 
          </ul> 
        </div> 
        
              </div> 
      <!-- End Box --> 
    </div> 
    <!-- End Left Column --> 
    <!-- Start Right Column --> 
    <div id="rightcolumn"> 
      
    <!-- Start Right Column --> 
    <div id="rightcolumn"> 
     <!-- Start Main Content --> 
      

<!-- End Left Column --> 
    <!-- Start Right Column --> 
    <div id="rightcolumn"> 
      <!-- Start Sponsor Ads Box --> 
      <div class="maincontent"> 
      <!-- End Sponsor Ads Box --> 


      <div id="container"> 
         <div id="header_container"> 
            <div id="pre_header"></div> 
            <div class="header"><h1 id="header"><span>Roberto Pacurucu </span></h1></div> 
            <div id="post_header"></div> 
         </div> 
         <div id="nav_container"> 
         <h2 id="nav_heading"><span></span></h2> 
            <ul id="nav"> 
                
            </ul> 
         </div>



Debajo de la pagina 
Código:
<div id="post_content"></div> 
                        <div id="sidebar_container"> 
               <h2 id="sidebar_heading"><span></span></h2> 
               <div id="sidebar_content"></div> 
            </div> 
         </div> 
      </div> 
            <!-- End Main Content --> 
    </div> 
    <!-- End Right Column --> 
  </div> 
  <!-- End Border --> 
  <!-- Start Footer --> 
  <div id="footer"> <center>Creado por: <a href="desingics.es.tl">desingics.es.tl</a> 2009-2011</center> </div> 
  <!-- End Footer --> 
</div> 
<br>



CSS sin style tags 
Código:
<style type="text/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;} 
* { 
 padding: 0; 
 margin: 0; 
} 
body { 
 font-family: Arial, Helvetica, sans-serif; 
 color: #FFFFFF; 
 background-color: #000000; 
 font-size: 12px; 
 background-image:url(http://i55.tinypic.com/j9wzuh.gif); 
 background-repeat:repeat; 
} 
.wrapper { 
 width: 782px; 
 margin: 0 auto; 
} 
#border { 
 border: 6px solid #000000; 
 margin: 20px 0px 5px 0px; 
 background-image:url(http://i55.tinypic.com/97uook.gif); 
 background-repeat:repeat; 
 min-height: 776px; 
 float: right; 
 width: 780px; 
} 
* html #border {height:776px} /* IE Min-Height Hack */ 
/* ------------------------ Start Header -----------------*/ 
.header { 
 text-align: center; 
 margin: 6px 0px 0px 0px; 
} 
/* ------------------------ End Header -----------------*/ 




/* ------------------------ Start Images -----------------*/ 
img { 
 display: inline; 
 border: none; 
} 
img.block { 
 display: block; 
} 
img.float { 
 float: left; 
 margin: 0px 14px 10px 0px; 
} 
/* ------------------------ End Images -----------------*/ 


/* ------------------------ Start Main Columns -----------------*/ 
#leftcolumn { /* Parent Wrapper for inside boxes */ 
 margin: 6px 0px 0px 4px; 
 display: inline; /* IE Hack */ 
 width: 240px; 
 float: left; 
 background-image: none; 
 background-repeat: no-repeat; 
 min-height: 300px; 
 padding: 0; 

} 
* html #leftcolumn {height:300px} /* IE Min-Height Hack */ 

.leftcolumn-inner { /* Parent Wrapper for inside boxes */ 
 display: inline; /* IE Hack */ 
 width: 220px; 
 float: left; 
 background-image: none; 
 background-repeat: no-repeat; 
 min-height: 40px; 
 padding: 10px; 
 margin-bottom: 7px; 
} 
* html .leftcolumn-inner {height:40px} /* IE Min-Height Hack */ 

.in-the-news { /* Parent Wrapper for inside boxes */ 
 display: inline; /* IE Hack */ 
 width: 235px; 
 float: left; 
 min-height: 125px; 
 margin-bottom: 7px; 
} 
* html .in-the-news {height:125px} /* IE Min-Height Hack */ 


#rightcolumn { 
/* border: 1px solid red;*/ 
 margin: 6px 0px 0px 0px; 
 display: inline; /* IE Hack */ 
 width: 513px; 
 float: left; 
 min-height: 300px; 
} 
* html #rightcolumn {height:300px} /* IE Min-Height Hack */ 

.sponsor { 
 background-image: none; 
 min-height: 80px; 
 background-repeat: no-repeat; 
 text-align: center; 
 padding: 15px 10px 10px 13px; 
 display: inline; /* IE Hack */ 
 float: left; 
 width: 510px; 
} 
* html .sponsor {height:80px} /* IE Min-Height Hack */ 

.maincontent { 
 min-height: 80px; 
 display: inline; /* IE Hack */ 
 float: left; 
 margin-bottom: 7px; 
 width: 530px; 
} 
* html .maincontent {height:80px} /* IE Min-Height Hack */ 

.content-mid { 
 background-image: none; 
 background-repeat: repeat; 
 padding: 5px 14px 5px 14px; 
} 
.left-mid { 
 background-image: none; 
 background-repeat: repeat; 
 padding: 5px 14px 10px 14px; 
} 
.left-heading { 
 background-image: none; 
 background-repeat: no-repeat; 
 padding: 9px 14px 5px 10px; 
 font-size: 16px; 
 color: #fff; 
 min-height: 11px; 
 font-weight: bold; 

} 
* html .left-heading {height:11px} /* IE Min-Height Hack */ 
/* ------------------------ End Main Columns -----------------*/ 

/* ------------------------- Start Headings ---------------------*/ 
h1 { 
 font-size: 16px; 
 color: #000000; 
} 
/* ------------------------- End Headings ---------------------*/ 

input { 
 border: 1px solid #000000; 
 width: 200px; 
} 



#footer { 
 font-size: 10px; 
 clear: both; 
 font-family: Century Gothic; 
 margin-bottom: 5px; 
color: #000 
} 
#nav-bar li { 
 list-style: none; 
} 

ul#daily-links li { 
 list-style: none; 
 margin-left: 2px; 
} 
ul#nav-links li { 
 display: inline; 
 margin-left: 0px; 
 padding-left: 12px; 

} 

ul#daily-links li a:link{ 
 color: #FFF; 
 text-decoration: none; 
 font-weight: bold; 
} 
ul#daily-links li a:visited{ 
 color: #ADFF2F; 
 text-decoration: none; 
 font-weight: bold; 
} 
ul#daily-links li a:hover{ 
 color: #FF1493; 
 text-decoration: none; 
 font-weight: bold; 
} 

#nav-bar a:link { 
 color: #000; 
 text-decoration: none; 
} 

#nav-bar a:visited { 
 color: #000; 
 text-decoration: none; 
} 

#nav-bar a:hover { 
 color: #ADFF2F; 
 text-decoration: none; 
} 
a:link { 
 color: #00BFFF; 
 text-decoration: none; 
} 
a:visited { 
 color: #ADFF2F; 
 text-decoration: none; 
} 

.valid { 
 margin: 10px 0px 0px 10px; 
} 


table {margin-left:auto;margin-right:auto;} 
               </style>
 
Este sitio web fue creado de forma gratuita con PaginaWebGratis.es. ¿Quieres también tu sitio web propio?
Registrarse gratis