Búsqueda en el Foro:
Buscar


Autor Mensaje
Mensaje26-05-2010, 19:44 (UTC)    
Título del mensaje: poner header

hola me pueden ayudar ponerle un header a este template pls


Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!--
Design by Free CSS Templates
http://www.freecsstemplates.org
Released for free under a Creative Commons Attribution 2.5 License

Name       : Bryce Sunrise
Description: A three-column, fixed-width blog design.
Version    : 1.0
Released   : 20100501

-->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Bryce Sunrise by Free CSS Templates</title>
<meta name="keywords" content="" />
<meta name="Bryce Sunrise" content="" />
<link href="default.css" rel="stylesheet" type="text/css" media="screen" />
</head>
<body>
<!-- start header -->
<div id="header">
   <div id="logo">
    <h1><a href="#">Bryce <span>Sunrise</span> </a></h1>
    <p>Designed By Free CSS Templates</p>
  </div>
  <div id="menu-bg">
  <div id="menu">
    <ul id="main">
      <li class="current_page_item"><a href="#">Homepage</a></li>
      <li><a href="#">Products</a></li>
      <li><a href="#">Services</a></li>
      <li><a href="#">About Us</a></li>
      <li><a href="#">Contact Us</a></li>
    </ul>
    <ul id="feed">
      <li><a href="#">Entries RSS</a></li>
      <li><a href="#">Comments RSS</a></li>
    </ul>
  </div>
  </div>
</div>
<!-- end header -->
<div id="wrapper">
  <!-- start page -->
  <div id="page">
    <!-- start content -->
 
    <!-- end content -->




debajo

Código:
 <!-- start sidebars -->
    <div id="sidebar1" class="sidebar">
      <ul>
        <li>
          <h2>Recent Posts</h2>
          <ul>
            <li><a href="#">Aliquam libero</a></li>
            <li><a href="#">Consectetuer adipiscing elit</a></li>
            <li><a href="#">Metus aliquam pellentesque</a></li>
            <li><a href="#">Suspendisse iaculis mauris</a></li>
            <li><a href="#">Urnanet non molestie semper</a></li>
            <li><a href="#">Proin gravida orci porttitor</a></li>
          </ul>
        </li>
        <li>
          <h2>Recent Comments</h2>
          <ul>
            <li><a href="#">Free CSS Templates</a> on <a href="#">Aliquam libero</a></li>
            <li><a href="#">Free CSS Templates</a> on <a href="#">Consectetuer adipiscing elit</a></li>
            <li><a href="#">Free CSS Templates</a> on <a href="#">Metus aliquam pellentesque</a></li>
            <li><a href="#">Free CSS Templates</a> on <a href="#">Suspendisse iaculis mauris</a></li>
            <li><a href="#">Free CSS Templates</a> on <a href="#">Urnanet non molestie semper</a></li>
            <li><a href="#">Free CSS Templates</a> on <a href="#">Proin gravida orci porttitor</a></li>
          </ul>
        </li>
        <li>
          <h2>Categories</h2>
          <ul>
            <li><a href="#">Aliquam libero</a></li>
            <li><a href="#">Consectetuer adipiscing elit</a></li>
            <li><a href="#">Metus aliquam pellentesque</a></li>
            <li><a href="#">Suspendisse iaculis mauris</a></li>
            <li><a href="#">Urnanet non molestie semper</a></li>
            <li><a href="#">Proin gravida orci porttitor</a></li>
          </ul>
        </li>
        <li>
          <h2>Archives</h2>
          <ul>
            <li><a href="#">September</a> (23)</li>
            <li><a href="#">August</a> (31)</li>
            <li><a href="#">July</a> (31)</li>
            <li><a href="#">June</a> (30)</li>
            <li><a href="#">May</a> (31)</li>
          </ul>
        </li>
      </ul>
    </div>
    <div id="sidebar2" class="sidebar">
      <ul>
        <li>
          <form id="searchform" method="get" action="#">
            <div>
              <input type="text" name="s" id="s" size="15" value="" />
              <br />
            </div>
          </form>
        </li>
        <li>
          <h2>Tags</h2>
          <p><a href="#">dolor</a> <a href="#">ipsum</a> <a href="#">lorem</a> <a href="#">sit amet</a> <a href="#">dolor</a> <a href="#">ipsum</a> <a href="#">lorem</a> <a href="#">sit amet, integer nisl risus, sagittis convallis, rutrum id, elementum congue</a></p>
        </li>
        <li>
          <h2>Calendar</h2>
          <div id="calendar_wrap">
            <table width="100%" summary="Calendar">
              <caption>
              October 2007
              </caption>
              <thead>
                <tr>
                  <th abbr="Monday" scope="col" title="Monday">M</th>
                  <th abbr="Tuesday" scope="col" title="Tuesday">T</th>
                  <th abbr="Wednesday" scope="col" title="Wednesday">W</th>
                  <th abbr="Thursday" scope="col" title="Thursday">T</th>
                  <th abbr="Friday" scope="col" title="Friday">F</th>
                  <th abbr="Saturday" scope="col" title="Saturday">S</th>
                  <th abbr="Sunday" scope="col" title="Sunday">S</th>
                </tr>
              </thead>
              <tfoot>
                <tr>
                  <td abbr="September" colspan="3" id="prev"><a href="#" title="View posts for September 2007">&laquo; Sep</a></td>
                  <td class="pad">&nbsp;</td>
                  <td colspan="3" id="next">&nbsp;</td>
                </tr>
              </tfoot>
              <tbody>
                <tr>
                  <td>1</td>
                  <td>2</td>
                  <td>3</td>
                  <td id="today">4</td>
                  <td>5</td>
                  <td>6</td>
                  <td>7</td>
                </tr>
                <tr>
                  <td>8</td>
                  <td>9</td>
                  <td>10</td>
                  <td>11</td>
                  <td>12</td>
                  <td>13</td>
                  <td>14</td>
                </tr>
                <tr>
                  <td>15</td>
                  <td>16</td>
                  <td>17</td>
                  <td>18</td>
                  <td>19</td>
                  <td>20</td>
                  <td>21</td>
                </tr>
                <tr>
                  <td>22</td>
                  <td>23</td>
                  <td>24</td>
                  <td>25</td>
                  <td>26</td>
                  <td>27</td>
                  <td>28</td>
                </tr>
                <tr>
                  <td>29</td>
                  <td>30</td>
                  <td>31</td>
                  <td class="pad" colspan="4">&nbsp;</td>
                </tr>
              </tbody>
            </table>
          </div>
        </li>
        <li>
          <h2>Categories</h2>
          <ul>
            <li><a href="#">Aliquam libero</a></li>
            <li><a href="#">Consectetuer adipiscing elit</a></li>
            <li><a href="#">Metus aliquam pellentesque</a></li>
            <li><a href="#">Suspendisse iaculis mauris</a></li>
            <li><a href="#">Urnanet non molestie semper</a></li>
            <li><a href="#">Proin gravida orci porttitor</a></li>
            <li><a href="#">Aliquam libero</a></li>
            <li><a href="#">Consectetuer adipiscing elit</a></li>
            <li><a href="#">Metus aliquam pellentesque</a></li>
            <li><a href="#">Urnanet non molestie semper</a></li>
            <li><a href="#">Proin gravida orci porttitor</a></li>
            <li><a href="#">Aliquam libero</a></li>
            <li><a href="#">Consectetuer adipiscing elit</a></li>
            <li><a href="#">Metus aliquam pellentesque</a></li>
            <li><a href="#">Suspendisse iaculis mauris</a></li>
            <li><a href="#">Urnanet non molestie semper</a></li>
            <li><a href="#">Proin gravida orci porttitor</a></li>
          </ul>
        </li>
      </ul>
    </div>
    <!-- end sidebars -->
    <div style="clear: both;">&nbsp;</div>
  </div>
  <!-- end page -->
</div>
<div id="footer">
  <div id="footer-content">
    <p>&copy;2007 All Rights Reserved. &nbsp;&nbsp; Design by <a href="http://www.freecsstemplates.org/">Free CSS Templates</a>.</p>
  </div>
</div>
</body>
</html>


css

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;}














/*
Design by Free CSS Templates
http://www.freecsstemplates.org
Released for free under a Creative Commons Attribution 2.5 License
*/

body {
   margin: 0;
   padding: 0;
   background: #191E1A;
   font-family: Arial, Helvetica, sans-serif;
   font-size: 13px;
   color: #FCFFFD;
}

h1, h2, h3 {
   margin-top: 0;
   color: #6E6C00;
}

h1 {
   font-size: 2em;
}

h2 {
   font-size: 1.6em;
}

h3 {
   font-size: 1em;
}

ul {
}

a {
   text-decoration: none;
   color: #FFFFFF;
}

a:hover {
   border-bottom: none;
}

a img {
   border: none;
}

img.left {
   float: left;
   margin: 0 20px 0 0;
}

img.right {
   float: right;
   margin: 0 0 0 20px;
}

/* Header */

#header {
   width: 100%;
   height: 210px;
}

#logo {
   width: 1000px;
   height: 150px;
   margin: 0 auto;
   padding: 0 10px;
}

#logo h1, #logo p {
   float: left;
   margin: 0;
   color: #FFFFFF;
}

#logo h1 {
   padding: 80px 0 0 0;
   text-transform: lowercase;
   font-weight: normal;
   font-size: 3em;
}

#logo p {
   text-transform: uppercase;
   padding: 102px 0 0 3px;
   font-size: 10px;
   color: #FFFFFF;
}

#logo a {
   border: none;
   text-decoration: none;
   color: #FFFFFF;
}

/* Menu */

#menu-bg {
   background: #1E3227;
   height: 45px;
}

#menu {
   width: 1000px;
   margin: 0 auto;
}

#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: 12px 15px 10px 15px;
   border: none;
   text-decoration: none;
   text-transform: uppercase;
   font-family: Arial, Helvetica, sans-serif;
   font-size: 11px;
   color: #DDBB04;
}

#menu a:hover {
   margin: 0 3px 0 0;
   background: #191E1A;
   border-bottom: 3px solid #DDBB04;
   color: #FFFFFF;
}

#menu .current_page_item a {
   background: none;
   margin: 0 3px 0 0;
   background: #191E1A;
   border-bottom: 3px solid #DDBB04;
   color: #FFFFFF;
}

/* Wrapper */

#wrapper {
}

/* Page */

#page {
   width: 1000px;
   margin: 0 auto;
   padding: 30px 0;
}

#page-bg {
   padding: 11px 24px;
}

/* Latest Post */

#latest-post {
   border: 1px dashed #8D8D8D;
}

/* Content */

#content {
   float: left;
   width: 498px;
   padding-right: 20px;
}

.post {
   margin-bottom: 20px;
   padding-bottom: 15px;
   line-height: 200%;
}

.post h1 {
   font-weight: normal;
   font-size: 30px;
}

.post h2 {
   font-size: 24px;
}

.title {
   margin: 0;
   padding: 15px 0px 0px 0px;
   font-weight: normal;
}

.title a {
   border-bottom: none;
}

.title a:hover {
   color: #FBD900;
}

.byline {
   margin: 0 0px 20px 0px;
   text-transform: uppercase;
}

.entry {
   padding: 0px 0px;
}

.links {
   font-size: 11px;
}

.links a {
   display: block;
   border: none;
   color: #FFFFFF;
}

.links a:hover {
}

.links .more {
   float: right;
   text-transform: uppercase;
}

.links .comments {
   float: left;
   padding-left: 20px;
}
/* Sidebars */

#sidebar1 {
   padding-right: 20px;
}

.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 {
   padding: 0px 15px;
}

.sidebar li li {
   padding: 8px 0 8px 0px;
   background: url(http://img41.xooimage.com/files/f/7/2/img01-1c9761a.jpg) repeat-x left bottom;
}

.sidebar li li a:hover {
   color: #FBD900;
}

.sidebar li h2 {
   margin: 0 0 10px 0;
   padding: 10px 15px 10px 15px;
   background: #1E3227;
   font-size: 16px;
   font-weight: normal;
   color: #FFFFFF;
}

.sidebar p {
   padding: 0px 15px;
}

.sidebar a {
   color: #FBD900;
}

/* Search */

#searchform {
   margin: 0;
   padding: 20px 15px;
}

#searchform br {
   display: none;
}

#s {
   margin: 0;
   padding: 2px 2px;
   width: 165px;
   height: 18px;
   border: none;
   background: #FFFFFF;
   font-size: 10px;
   color: #000000;
}

#x {
   margin: 1px 0 0 0;
   padding: 2px 5px;
   height: 24px;
   border: none;
   background: #000000;
   text-decoration: none;
   text-transform: uppercase;
   font-family: Arial, Helvetica, sans-serif;
   font-size: 10px;
   color: #FFFFFF;
}
/* Calendar */

#calendar_wrap {
   padding: 0;
   text-align: center;
}

#calendar_wrap table {
   width: 100%;
}

#calendar_wrap th {
}

#calendar_wrap td {
}

#calendar_wrap tfoot td {
   border: none;
}

#calendar_wrap tfoot td#prev {
   text-align: left;
   font-weight: bold;
   border: none;
}

#calendar_wrap tfoot td#prev a {
   border: none;
}

#calendar_wrap tfoot td#next {
   text-align: right;
   font-weight: bold;
   border: none;
}

#calendar_wrap tfoot td#next a {
   border: none;
}

/* Footer */

#footer {
   background-color: #0D170F;
   height: 50px;
}

#footer-content {
   width: 1000px;
   margin: 0px auto;
}

#footer p {
   margin: 0;
   padding: 20px 0 0 0;
   text-align: left;
   text-transform: uppercase;
   font-size: 10px;
   color: #FBD900;
}

#footer a {
   color: #FBD900;
}
Mensaje26-05-2010, 22:04 (UTC)    
Título del mensaje:

Hola

el header esta incluido en el codigo que tienes

Pero silo q quieres es poner un fondo a ese header el codigo es este

Código:
<style type="text/css">

#header {

   background-image:url(http://www.ginkgogardens.com.au/images/headers/water_header.gif);
</style>


ponlo por encima de la pagina pero si lo quieres poner en CSS-Code sin Style Tags solo quitale las etiquetas

salu2
Mensaje27-05-2010, 16:05 (UTC)    
Título del mensaje:

vale ya lo tengo muchas gracias
Mostrar mensajes anteriores:   


Powered by phpBB © 2001, 2005 phpBB Group