Inicio > Crear web desde cero > Maquetar cabecera con CSS

Maquetar cabecera con CSS

Seguimos con las lecciones para maquetar nuestra primer pagina web, en esta ocación veremos como maquetar la cabecera

Cabecera

Teniendo el contenedor general y siguiendo el diagrama de maquetación que vimos antes, es hora de crear la cabecera de nuestro sitio, a esta le asignaremos el alto que queremos que tenga, siempre dentro de los limites que definimos en el contenedor general, obviamente usaremos mucho menos, solo 50 pixeles, y también un color de fondo (verde) para ir notando cada capa, quedando así:

#cabecera {
       background-color: green;
       height:50px;
       padding:5px;
}


y llamamos a esta capa desde el código HTML, pero ojo, tiene que ir dentro de la capa contenedora, así:

<html>
<head>
<title>Maquetando con estilos CSS</title>
<link href="estilos.css" rel="stylesheet" type="text/css">
</head>
<body>
        <div id="contenedor">
                <div id="cabecera">Esta es la cabecera</div>
       </div>

</body>
</html>

 


Perfecto, ya hemos maquetado el contenedor general y la cabecera, sigamos con la barra lateral.