Búsqueda en el Foro:
Buscar


Autor Mensaje
Mensaje10-01-2012, 15:20 (UTC)    
Título del mensaje: [Diseño CSS]Blue World

Antes de nada , sino te gusta la plantilla mejor para tu web ahorate el comentario que ya savemos que todos hacemos posts para ser semi-expertos pero ... , otra cosa también sera mejor para tu web que dejes los creditos del autor que diseño la plantilla y de mi que la adapte


Vista



Por encima de la página

Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>BlueWorld</title>

<meta http-equiv="content-type" content="text/html; charset=utf-8" />

<link href="style.css" rel="stylesheet" type="text/css" />

<script type="text/javascript" src="js/cufon-yui.js"></script>

<script type="text/javascript" src="js/arial.js"></script>

<script type="text/javascript" src="js/cuf_run.js"></script>

</head>

<body>

<!-- START PAGE SOURCE -->

<div class="main">

  <div class="header">

    <div class="header_resize">

      <div class="logo">

        <h1><a href="index.html">Blue<span>World</span><br />

          <small>Put your slogan here</small></a></h1>

      </div>

      <div class="menu">

        <ul>

          <li><a href="index.html" class="active">Home</a></li>

          <li><a href="services.html">Services</a></li>

          <li><a href="about.html"> About Us </a></li>

          <li><a href="contact.html"> Contact Us</a></li>

        </ul>

      </div>

    </div>

    <div class="clr"></div>

  </div>

  <div class="clr"></div>

  <div class="body">

    <div class="body_resize">

      <div class="left">


Por debajo de la página

Código:

      </div>

      <div class="right">

        <h2> Sidebar Menu</h2>

        <ul>

          <li><a href="#">Home</a></li>

          <li><a href="#">TemplateInfo</a></li>

          <li><a href="#">Style Demo</a></li>

          <li><a href="#">Blog</a></li>

          <li><a href="#">Archives</a></li>

        </ul>

        <h2>Sponsors</h2>

        <ul class="sponsors">

          <li class="sponsors"><a href="#">Lorem ipsum dolor</a><br />

            Donec libero. Suspendisse bibendum</li>

          <li class="sponsors"><a href="#">Dui pede condimentum</a><br />

            Phasellus suscipit, leo a pharetra</li>

          <li class="sponsors"><a href="#">Condimentum lorem</a><br />

            Tellus eleifend magna eget</li>

          <li class="sponsors"><a href="#">Fringilla velit magna</a><br />

            Curabitur vel urna in tristique</li>

          <li class="sponsors"><a href="#">Suspendisse bibendum</a><br />

            Cras id urna orbi tincidunt orci ac</li>

          <li class="sponsors"><a href="#">Donec mattis</a><br />

            purus nec placerat bibendum</li>

        </ul>

        <p>&nbsp;</p>

        <div class="clr"></div>

      </div>

      <div class="clr"></div>

    </div>

  </div>

  <div class="FBG">

    <div class="blok">

      <h2>Image Gallery</h2>

      <img src="http://i56.tinypic.com/2ih40u0.png" alt="" width="68" height="68" /> <img src="http://i56.tinypic.com/2ih40u0.png" alt="" width="68" height="68" /> <img src="http://i56.tinypic.com/2ih40u0.png" alt="" width="68" height="68" /> <img src="http://i56.tinypic.com/2ih40u0.png" alt="" width="68" height="68" /> <img src="http://i56.tinypic.com/2ih40u0.png" alt="" width="68" height="68" /> <img src="http://i56.tinypic.com/2ih40u0.png" alt="" width="68" height="68" />

      <div class="clr"></div>

      <h2>Contact Info </h2>

      <p>Phone: +1234567<br />

        Address: 123 Put Your Address Here <br />

        E-mail: <a href="#">me@jungleland.com</a><br />

        contact page </p>

    </div>

    <div class="blok">

      <h2>Lorem Ipsum</h2>

      <p>Lorem ipsum dolor <br />

        Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec libero. Suspendisse bibendum. Cras id urna. Morbi tincidunt, orci ac convallis aliquam, lectus turpis varius lorem, eu posuere nunc justo tempus leo. <br />

        Donec mattis, purus nec placerat bibendum, dui pede condimentum odio, ac blandit ante orci ut diam.</p>

      <ul>

        <li>consequat molestie</li>

        <li>sem justo</li>

        <li>semper</li>

        <li>magna sed purus</li>

        <li>tincidunt</li>

      </ul>

    </div>

    <div class="blok">

      <h2>Lorem Ipsum</h2>

      <p>Este diseño ha sido adaptado por webics , si utilizas la plantilla y no dejas los creditos tu web sera cerrada!</p>

      <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec libero. Suspendisse bibendum. Cras id urna. <a href="#">Learn more...</a></p>

    </div>

    <div class="clr"></div>

  </div>

  <div class="footer">

    <div class="footer_resize">

      <p class="lf">Copyright &copy; 2010 <a href="www.webics.es.tl">Diseño adaptado por webics.es.tl</a>
      <p class="rf"><a href="http://www.free-css.com/">Free CSS Templates</a> by <a href="http://www.hotwebsitetemplates.net">Hot Website Templates</a></p>

      <div class="clr"></div>

    </div>

    <div class="clr"></div>

  </div>

</div>

<!-- END PAGE SOURCE -->

</body>

</html>


Css Code

Código:
table {margin-left:auto;margin-right:auto;}




#pre_header {display: none;}
#post_header {display: none;}
#header_container {display: none;}
lli.nav_element{display: none;}
li.nav_element a{display: none;}
h1#title{display: none;}
h2#title span {display: none;}
#title {display: none;}
#nav_container {display:none;}


@charset "utf-8";
body {
   margin:0;
   padding:0;
   width:100%;
   background:url(http://i43.tinypic.com/2r7lrbo.gif);
}
html {
   padding:0;
   margin:0;
}
li.bg, .bg {
   clear:both;
   border-bottom:1px solid #cccccc;
   border-top:1px solid #cccccc;
   padding:0;
   margin:10px 0;
   background:#fff;
   list-style:none;
   height:1px;
}
li.bg2, .bg2 {
   clear:both;
   border-bottom:1px dashed #dfdfdf;
   padding:0;
   margin:10px 0;
   background:none;
   list-style:none;
}
p.clr, .clr {
   clear:both;
   padding:0;
   margin:0;
}
.main {
   margin:0 auto;
   padding:0;
}
a {
   color:#00b3ea;
   text-decoration:none;
}
.header_resize {
   margin:0 auto;
   padding:0;
   width:960px;
}
.header {
   margin:0;
   padding:0;
   background:top center repeat-x;
}
.logo {
   width:450px;
   margin:0 auto;
   padding:0;
   float:left;
}
h1 {
   margin:0;
   padding:24px 0 24px 40px;
   color:#00b3ea;
   font:bold 40px/1.5em Arial, Helvetica, sans-serif;
   text-transform:uppercase;
   letter-spacing:-2px;
}
h1 a, h1 a:hover {
   color:#00b3ea;
   text-decoration:none;
}
h1 span {
   margin-left:8px;
   padding:0 8px 4px 4px;
   color:#fff;
   background-color:#00b3ea;
}
h1 small {
   padding-left:170px;
   font:normal 13px/1.5em Arial, Helvetica, sans-serif;
   color:#fff;
   letter-spacing:normal;
}
.menu {
   padding:80px 0 0 0;
   margin:0;
   width:410px;
   float:right;
}
.menu ul {
   padding:0;
   margin:0;
   list-style:none;
   border:0;
   float:right;
}
.menu ul li {
   float:left;
   margin:0;
   padding:0;
   border:0;
}
.menu ul li a {
   float:left;
   margin:0;
   padding:8px 15px;
   color:#fff;
   font:bold 12px Arial, Helvetica, sans-serif;
   text-decoration:none;
}
.menu ul li a:hover {
   background:#07bdf5;
}
.menu ul li a.active {
   background:#07bdf5;
}
.body_resize {
   margin:0 auto;
   padding:10px 20px;
   background:#fff;
   width:906px;
   border:7px solid #3090be;
}
.body {
   margin:0;
   padding:0;
}
.body h2 {
   font:bold 24px Arial, Helvetica, sans-serif;
   color:#00b3ea;
   padding:10px 5px;
   margin:5px 0 10px 0;
}
.body h2 span {
   font:normal 12px Arial, Helvetica, sans-serif;
   color:#959595;
}
.body p {
   font:normal 12px Arial, Helvetica, sans-serif;
   color:#5f5f5f;
   padding:5px;
   margin:0;
   line-height:1.8em;
}
.body p span {
   font:bold 14px Georgia, "Times New Roman", Times, serif;
   color:#4b4b4b;
   padding:0;
   margin:0;
}
.body img {
   float:left;
   margin:5px;
   padding:0;
}
.body img.floated {
   float:left;
   margin:5px 10px 5px 0;
   padding:0;
}
.left {
   float:left;
   width:630px;
   margin:0;
   padding:0;
}
.right {
   float:right;
   width:260px;
   margin:0;
   padding:0;
}
.right ul {
   list-style:none;
   margin:5px 10px;
   padding:0;
}
.right li {
   font:normal 14px Arial, Helvetica, sans-serif;
   color:#464646;
   padding:5px 0;
   margin:3px 0;
}
.right li a {
   padding:0 0 0 5px;
   margin:0;
   font:normal 13px Georgia, "Times New Roman", Times, serif;
   color:#5f5f5f;
   text-decoration:none;
}
.right li a:hover {
   color:#3085ca;
   text-decoration:none;
}
.right ul.sponsors {
   list-style:none;
   margin:5px 10px;
   padding:0;
}
.right li.sponsors {
   background:none;
   font:normal 11px Georgia, "Times New Roman", Times, serif;
   color:#959595;
   padding:10px 0;
}
.right li.sponsors a {
   padding:0;
   margin:0;
   font:normal 13px Georgia, "Times New Roman", Times, serif;
   color:#5f5f5f;
   text-decoration:none;
}
.right li.sponsors strong {
   color:#00b3ea;
}
.FBG {
   margin:0 auto;
   padding:0;
   width:960px;
}
.FBG ul {
   margin:0;
   padding:0;
   list-style:none;
}
.FBG li {
   font:normal 12px Arial, Helvetica, sans-serif;
   color:#fff;
   border-bottom:1px solid #fff;
   padding:5px;
   margin:0;
}
.FBG h2 {
   font:bold 24px Arial, Helvetica, sans-serif;
   color:#fff;
   padding:10px 0;
   margin:0;
}
.FBG p {
   font:normal 12px Arial, Helvetica, sans-serif;
   color:#fff;
   padding:5px;
   margin:0;
   line-height:1.8em;
}
.FBG img {
   float:left;
   margin:5px 10px 5px 0;
   padding:0;
}
.FBG .blok {
   width:280px;
   float:left;
   padding:10px 20px;
   margin:0;
}
.footer_resize {
   margin:0 auto;
   padding:10px 20px;
   width:920px;
   border-top:1px solid #b5cad6;
}
.footer {
   padding:0;
   margin:0 auto;
   color:#fefdfb;
   font:normal 12px Arial, Helvetica, sans-serif;
}
.footer p {
   margin:0;
   padding:4px 0;
   line-height:normal;
   color:#fefdfb;
}
.footer a {
   color:#fefdfb;
   padding:inherit;
   text-decoration:underline;
}
.footer a:hover {
   text-decoration:none;
}
.footer .lf {
   float:left;
}
.footer .rf {
   float:right;
}
#contactform {
   margin:0;
   padding:5px;
}
#contactform * {
   color:#F00;
}
#contactform ol {
   margin:0;
   padding:0;
   list-style:none;
}
#contactform li {
   margin:0;
   padding:0;
   background:none;
   border:none;
   display:block;
   clear:both;
}
#contactform li.buttons {
   margin:5px 0;
}
#contactform label {
   margin:0;
   width:110px;
   display:block;
   padding:10px 0;
   color:#666;
   font:normal 12px Arial, Helvetica, sans-serif;
   text-transform:capitalize;
   float:left;
}
#contactform label span {
   color:#F00;
}
#contactform input.text {
   width:480px;
   border:1px solid #c0c0c0;
   margin:2px 0;
   padding:5px 2px;
   height:16px;
   background:#fff;
   float:left;
}
#contactform textarea {
   width:480px;
   border:1px solid #c0c0c0;
   margin:2px 0;
   padding:2px;
   background:#fff;
   float:left;
}
#contactform li.buttons input {
   border:1px solid #000;
   background:#ea7d1b;
   padding:10px;
   margin:10px 0 0 110px;
   color:#fff;
   float:left;
   font:normal 12px Arial, Helvetica, sans-serif;
}
p.response {
   text-align:center;
   color:#F00;
   font:normal 11px Georgia, "Times New Roman", Times, serif;
   line-height:1.8em;
   width:auto;
}
Mensaje11-01-2012, 16:22 (UTC)    
Título del mensaje:

Buen Diseño.
______________


Super Mario la lleva, es lo mejor en Videojuegos, se los recomiendo
Mensaje11-01-2012, 16:35 (UTC)    
Título del mensaje:

supermarioworldsnes escribió:
Buen Diseño.


Gracias por tu comentario
Mensaje11-01-2012, 17:17 (UTC)    
Título del mensaje:

Mensaje11-01-2012, 18:52 (UTC)    
Título del mensaje: hola

es muy bueno
Mensaje16-01-2012, 16:42 (UTC)    
Título del mensaje:

no me gusto
______________
Luciano Jmz
Luciano Jmz
Mostrar mensajes anteriores:   


Powered by phpBB © 2001, 2005 phpBB Group