CP Group - Blog-style

Blog-style

Diseño para css-desing:

Nombre: Blog Style.

Codigo por encima de la pagina:

Codigo por debajo de la pagina:

<div id="sidebar1" class="sidebar"> <ul> <li>    <h2>Box 1!</h2> <ul>    Contenido que tu quieras!  </ul> </li> <li>    <h2>Box 2!</h2>    Contenido que tu quieras!  </li> <li>     <h2>Link's</h2> <ul>    <li><a href="URL DE LINK'S" _fcksavedurl="URL DE LINK'S">NOMBRE DEL LINK'S</a></li>    <li><a href="URL DE LINK'S" _fcksavedurl="URL DE LINK'S">NOMBRE DEL LINK'S</a></li>    <li><a href="URL DE LINK'S" _fcksavedurl="URL DE LINK'S">NOMBRE DEL LINK'S</a></li>    <li><a href="URL DE LINK'S" _fcksavedurl="URL DE LINK'S">NOMBRE DEL LINK'S</a></li>    <li><a href="URL DE LINK'S" _fcksavedurl="URL DE LINK'S">NOMBRE DEL LINK'S</a></li>    <li><a href="URL DE LINK'S" _fcksavedurl="URL DE LINK'S">NOMBRE DEL LINK'S</a></li>    <li><a href="URL DE LINK'S" _fcksavedurl="URL DE LINK'S">NOMBRE DEL LINK'S</a></li> </ul> </li> <li>    <h2>Lo más visto...</h2> <ul>    <li><a href="URL DE LA PAGINA" _fcksavedurl="URL DE LA PAGINA">NOMBRE DE LA PAGINA</a></li>    <li><a href="URL DE LA PAGINA" _fcksavedurl="URL DE LA PAGINA">NOMBRE DE LA PAGINA</a></li>  </ul> </li> </ul> </div> <div id="sidebar2" class="sidebar"> <ul> <li>    <h2>Buscador</h2>       <center><form id="searchform" method="get" action="#">    <div>    <input type="text" name="s" id="s" size="15" value="" />    <br />    <input type="submit" value="Busca!" id="x" />    </div>    </form></center>     </li> <li>    <h2>Box 3!</h2>    Contenido que tu quieras!  <li>    <h2>Web Recomendadas</h2> <ul>    <li><a href="#" _fcksavedurl="#">Link's</a></li>    <li><a href="#" _fcksavedurl="#">Link's</a></li>    <li><a href="#" _fcksavedurl="#">Link's</a></li>    <li><a href="#" _fcksavedurl="#">Link's</a></li>    <li><a href="#" _fcksavedurl="#">Link's</a></li>    <li><a href="#" _fcksavedurl="#">Link's</a></li>    <li><a href="#" _fcksavedurl="#">Link's</a></li>    <li><a href="#" _fcksavedurl="#">Link's</a></li>    <li><a href="#" _fcksavedurl="#">Link's</a></li>    <li><a href="#" _fcksavedurl="#">Link's</a></li>    <li><a href="#" _fcksavedurl="#">Link's</a></li>    <li><a href="#" _fcksavedurl="#">Link's</a></li>    <li><a href="#" _fcksavedurl="#">Link's</a></li>    <li><a href="#" _fcksavedurl="#">Link's</a></li>    <li><a href="#" _fcksavedurl="#">Link's</a></li>    <li><a href="#" _fcksavedurl="#">Link's</a></li>    <li><a href="#" _fcksavedurl="#">Link's</a></li> </ul> </li> </ul> </div> <div style="clear: both;"> </div> </div> </div> <div id="footer">    <p>©2008-2009 <a href="URL DE TU WEB" _fcksavedurl="URL DE TU WEB">Nombre de tu web</a>. Todos los derechos reservados.</p>    </div>

Sin Style tag:

#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;}  body {    margin: 0;    padding: 0;    background: #424242 url(http://pixelea.com/s/161907b7c0.jpg) repeat-x;    font-family: Arial, verdana;    font-size: 12px;    color: white; }  a {       color: #ff9933; } a:hover {    color: yellow; } img.left {    float: left;    margin: 0 20px 0 0; }  img.right {    float: right;    margin: 0 0 0 20px; }  #logo {    width: 880px;    height: 88px;    margin: 0 auto;    padding: 0 10px; }  #logo h1, #logo p {    float: left;    margin: 0;    color: #FFFFFF; }  #logo h1 {    padding: 30px 0 0 0;    text-transform: none;    font-weight: normal;    font-size: 3em; }  #logo p {    text-transform: none;    padding: 52px 0 0 3px;    font-size: 10px;    color: #616161; }  #logo a {    border: none;    text-decoration: none;    color: #FFFFFF; }  #menu {    width: 880px;    height: 42px;    margin: 0 auto;    padding-top: 10px; }  #menu ul {    margin: 0;    padding: 0;    list-style: none; }  #menu li {    display: inline; }  #menu a {    display: block;    float: left;    margin: 0 3px 0 0;    padding: 8px 15px 10px 15px;    border: none;    text-decoration: none;    text-transform: uppercase;    font-family: Arial, Helvetica, sans-serif;    font-size: 10px;    color: #CCCCCC; }  #menu a:hover {    background: url(http://pixelea.com/s/e17f29347c.jpg) repeat-x;    margin: 0 3px 0 0;    padding: 8px 15px 10px 15px;    color: #FFFFFF; }  #menu .current_page_item a {    background: url(http://pixelea.com/s/e17f29347c.jpg) repeat-x;    margin: 0 3px 0 0;    padding: 8px 15px 10px 15px;    color: #FFFFFF; }  #wrapper {    background: #000000; }  #page {    width: 880px;    margin: 0 auto;    padding: 30px 0; }  #page-bg {    padding: 11px 24px;    background: url(http://pixelea.com/s/be81071b1f.gif) no-repeat; }    #content {    float: left;    width: 438px; }  .post {    margin-bottom: 20px;    padding-bottom: 15px;    border-bottom: 1px dotted #949494;    line-height: 200%; }  .post h1 {    font-weight: normal; }  .title {    margin: 0;    font-weight: normal; }  .title a {    border-bottom: none; }  .title a:hover {    border-bottom: 1px dotted #CCCCCC; }  .byline {    margin: 0 0 20px 0; }  .entry {    padding: 0 20px; }  .links {    padding-top: 10px;    text-align: right;    font-weight: bold; }  .links a {    padding-left: 15px;    background: url(http://pixelea.com/s/adf9eef6a5.gif) no-repeat left center;    border: none; }  .links a:hover {    border-bottom: 1px dotted #CCCCCC; }  .sidebar {    float: left;    width: 200px;    padding: 0 0 0 21px; }  .sidebar ul {    margin: 0;    padding: 0;    list-style: none; }  .sidebar li {    padding: 0 0 20px 0; }  .sidebar li ul { }  .sidebar li li {    padding: 5px 0 5px 25px;    background: url(http://pixelea.com/s/adf9eef6a5.gif) no-repeat 10px 9px; }  .sidebar li h2 {    margin: 0 0 10px 0;    padding: 5px 10px;    background: url(http://pixelea.com/s/5afb5457f3.jpg) repeat-x;    border: 1px solid #4A4A4A;    font-size: 12px;    color: #CCCCCC; }  #footer {    height: 50px;    background: #000000 url(http://pixelea.com/s/405d86b969.jpg) repeat-x left top;    text-align: center; }