Diseño CSS IceBlue [PWG]

Diseño CSS para PaginaWebGratis, totalmente adaptado por AllCss y alojado en un hosting propio para evitar caídas de links/imagenes o estilos.

VISTA PREVIA ONLINE

~ o ~

Texto por encima de la página:

</head>
</head>

<body>
<div id="main">
  
  <div id="tray" class="box">
    <p class="f-left box">

      <span class="f-left" id="switcher"><b>Texto Arriba 1</b> </span> 
  </p>
<p class="f-right">
<b>Texto Arriba 2</b> </p>
</div>

  <hr class="noscreen" />
  
  <div id="menu" class="box">
    <ul class="box f-right">
<li><a href="#"><span><b>Texto Arriba 3</b></span></a></li>
</ul>
<ul class="box"><div class="ad">
</div>
<li><a href="#"><span>Link 1</span></a></li>
<li><a href="#"><span>Link 2</span></a></li>
<li><a href="#"><span>Link 3</span></a></li>
<li><a href="#"><span>Link 4</span></a></li>
<li><a href="#"><span>Link 5</span></a></li>
</ul>
</div>

  <hr class="noscreen" />
  
  <div id="cols" class="box">
    
    <div id="aside" class="box">
      <div class="padding box">
        
        <p id="logo">
<a href="http://allcss.blogspot.com/"><img src="http://allcss.zz.mu/logo.png" alt="" /></a></p>

        <p id="btn-create" class="box">
<a href="#"><span>
  Link 6</span></a></p>
</div>

      <ul class="box">
<li id="submenu-active"><a href="#">BOX 1</a>
          <ul>
<li><a href="#">Link 1.1</a></li>
<li><a href="#">Link 1.2</a></li>
<li><a href="#">Link 1.3</a></li>
<li><a href="#">Link 1.4</a></li>
<li><a href="#">Link 1.5</a></li>
</ul>
</li>
</ul>
<ul class="box">
<li id="submenu-active"><a href="#">BOX 2</a>
          
          <ul>
<li><a href="#">Link 2.1</a></li>
<li><a href="#">Link 2.2</a></li>
<li><a href="#">Link 2.3</a></li>
<li><a href="#">Link 2.4</a></li>
<li><a href="#">Link 2.5</a></li>
</ul>
</li>
<li></li>
</ul>
</div>
<div id="container">
   <div id="header_container">
    <div id="pre_header">
</div>
<div class="header">
</div>
<div id="post_header">
</div>
</div>
<div id="nav_container">
   <h2 id="nav_heading">
<span></span></h2>
</div>
<div id="content_container">
    <div id="pre_content">
</div>
<div id="content">

Texto por debajo de la página:

</div>
<div id="counter">
<span></span></div>
<div id="post_content">
</div>
<div id="below_content">

ul.gallery li div.info{position:absolute;overflow:hidden;margin:-126px 0 0 10px;display:none;width:296px;height:126px;}

.widget ul.gallery li{float:left;display:block;overflow:hidden;width:316px;height:220px;margin:0;padding:0;-moz-box-shadow: 0px 1px 1px #D6DAC2;-webkit-box-shadow: 0px 1px 1px #D6DAC2;box-shadow: 0px 1px 1px #D6DAC2;}

/*.gl-date{padding:2px;background:#fff;-moz-box-shadow: 0px 1px 1px #D6DAC2;-webkit-box-shadow: 0px 1px 1px #D6DAC2;box-shadow: 0px 1px 1px #D6DAC2;}
*/
ul.gallery li div.info .box{overflow:hidden;}
.websitemeta{border:dashed 1px #DDD;display:block;overflow:hidden;padding:2px;}
.websitemeta h4 a{float:left;font:bold 16px "Trebuchet MS", sans-serif;letter-spacing: -1px;color:#77d5e7;padding:3px 0px 3px 3px; margin:0px 0px 0px 0;}
.websitemeta h4 a:hover{color:#E75802;text-decoration:none;font:bold 16px "Trebuchet MS", sans-serif;}

.gl-date{float:right;display:block;padding:0 2px;margin:0;}
.gl-date-day{padding:0px 5px 0px 0px;float:left;font: 20px "Trebuchet MS", sans-serif;letter-spacing: -1px;color:#E75802;}
.gl-date-end{float:left;text-align:center;padding:1px 0 0 0px;}
.gl-date-month{line-height:12px!important;font: 11px "Trebuchet MS", sans-serif;letter-spacing: -1px;color:#E75802;padding:0px; margin:0;}
.gl-date-year{line-height:12px!important;clear:both;font: 11px "Trebuchet MS", sans-serif;letter-spacing: -1px;color:#E75802;padding:0px; margin:0;}

.website-title{border:dashed 1px #DDD;display:block;overflow:hidden;padding:2px;}
.website-title h1{float:left;width:530px;font:26px "Trebuchet MS", sans-serif;letter-spacing: -1px;color:#E75802;border:none;margin:0!important;padding:3px 0 3px 5px!important;}
.website-title .gl-date{margin:3px 0 0 0;}
.website-title .gl-date-day{padding:0px 5px 0px 0px;float:left;font: 26px "Trebuchet MS", sans-serif;letter-spacing: -1px;color:#E75802;}
.website-title .gl-date-end{float:left;text-align:center;padding:1px 0 0 0px;}
.website-title .gl-date-month{line-height: 16px!important;font:bold 16px "Trebuchet MS", sans-serif;letter-spacing: -1px;color:#E75802;padding:0px; margin:0;}
.website-title .gl-date-year{line-height:16px!important;clear:both;font:bold 16px "Trebuchet MS", sans-serif;letter-spacing: -1px;color:#E75802;padding:0px; margin:0;}

.website .desc{margin:0 10px 15px 10px;}
.widget .websitemeta{border:0px;margin:0 0 0 5px;}
.widget .websitemeta li{padding:3px 0 3px 20px;background: url("/template/v5/images/bullet-orange.gif") no-repeat 0 2px;}
.widget .websitemeta li a {color:#E75802;}
.widget .websitemeta li a:hover {text-decoration:underline;}
/********** Website detail ************/
.website-content{overflow:hidden;}
.website-content p {margin:0 10px;}
.website-img{float:left;display:block;overflow:hidden;width:642px;height:442px;margin:10px 0;padding:0;-moz-box-shadow: 0px 1px 1px #D6DAC2;-webkit-box-shadow: 0px 1px 1px #D6DAC2;box-shadow: 0px 1px 1px #D6DAC2;}
.website-img img{border:1px #DDD solid;margin:4px;}
.website-img a.thumb{border:1px #DDD solid;display:block;overflow:hidden; width:640px;height:440px;margin:0px;padding:0;background:#fff}

.related-section ul.gallery{float:left;display:block;overflow:hidden; width:100%;margin:5px 0 15px 0;}
.related-section ul.gallery li{float:left;display:block;overflow:hidden;width:316px;height:220px;margin:5px 3px 3px 2px;padding:0;-moz-box-shadow: 0px 1px 1px #D6DAC2;-webkit-box-shadow: 0px 1px 1px #D6DAC2;box-shadow: 0px 1px 1px #D6DAC2;}

ul.color-list{width:100%;display:block;margin:15px 0 0 0;overflow:hidden;}
ul.color-list li{float:left;margin:0 8px 0 8px;font-size:8px;}
ul.color-list li a{border:4px #fff solid;display:block;width:40px;height:40px;margin:0 0 2px 0;padding:0;line-height:10px;
box-shadow: 
        0px 1px 1px #D6DAC2,
        inset 0 2px rgba(255,255,255,0.3),
        inset 0 -3px rgba(0,0,0,0.1);  
    -o-box-shadow: 
        0px 1px 1px #D6DAC2,
        inset 0 2px rgba(255,255,255,0.3),
        inset 0 -3px rgba(0,0,0,0.1);       
    -webkit-box-shadow:
        0px 1px 1px #D6DAC2, 
        inset 0 2px rgba(255,255,255,0.3),
        inset 0 -3px rgba(0,0,0,0.1);     
    -moz-box-shadow:
        0px 1px 1px #D6DAC2,
        inset 0 2px rgba(255,255,255,0.3),
        inset 0 -3px rgba(0,0,0,0.1);}

div.ad_list{width:100%;}
div.ads_block{display:block;margin:0 auto 0 auto;overflow:hidden;}
div.ads_block a.ads-link{background:transparent;display:block;float:left;}
div.advertisehere{width:100%;display:block;text-align:center;}
.websitemeta {
    background-color: white !important;
}

.pagination{margin:5px;width:670px;overflow:hidden;}

.pagination a{background:#fff;border:solid 1px #DDDDDD;margin-right:2px;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;}
.pagination .pagi-desact {color:#666666;display:block;float:left;font-weight:bold;padding:3px 4px;}

.pagination .pagi-current{color:#000;font-weight:bold;display:block;float:left;padding:4px 6px;}

.pagination a:link,
.pagination a:visited {color:#77D5E7;display:block;float:left;padding:3px 6px;text-decoration:none;}
.pagination a:hover{border:solid 1px #77D5E7;}
</style>

</div>
<div id="sidebar_container">
     <h2 id="sidebar_heading">
<span></span></h2>
<div id="sidebar_content">
</div>
</div>
</div>
</div>
</div>

  <hr class="noscreen" />
  
  <div id="footer" class="box">
    <p class="f-left">
© 2015 <a href="http://allcss.blogspot.com/">AllCss</a>, Todos los derechos reservados ®
         <div id="extraDiv1">
<span></span></div>
<div id="extraDiv2">
<span></span></div>
<div id="extraDiv3">
<span></span></div>
<div id="extraDiv4">
<span></span></div>
<div id="extraDiv5">
<span></span></div>
<div id="extraDiv6">
<span></span></div>
</body>
</html>

CSS-Code sin Style Tags:

Diseño CSS IceBlue [PWG]

Acerca de: Unknown

0 comentarios:

Síguenos en Facebook

Lo + Popular

Diseño CSS IceBlue [PWG]

Acerca de: Unknown

0 comentarios:

KI2 en las Redes Sociales

Síguenos en Facebook

Lo + Popular