Como hacer una pagina web y ganar dinero
Creada para aprender lo que mas nesesitas porque la calidad es mejor que la cantidad.
Blog

Comenzando Maquetación CSS

Tags: maquetar, css, estilo, html, contenedor, general
publicado el 2010-06-03   leido 4313 leídas

A lo largo del manual de hacer una web paso a paso vimos los conceptos básicos para crear y poder flotar capas entre otras cosas, ahora vamos a tratar de poner en práctica lo que aprendimos para maquetar una pagina con la siguiente estructura:
  • Cabecera: acá puede ir un logo o el nombre de tu pagina web
  • Barra lateral: podemos poner un menu vertical con listas HTML
  • Contenido: donde irá el contenido de la web
  • Pie de pagina: podemos poner lo que necesitemos, desde el copyright hasta los enlaces recomendados
La estructura deberá quedar así:



comenzaremos maquetando el contenedor general.

Maquetar el contenedor general con CSS


La primer capa que tendremos que crear es un contenedor general al que le aplicaremos un ancho y alto fijo para todo el sitio Web.

Para este ejemplo lo haremos con estas medidas:
  • Ancho: 900 pixeles
  • Alto: 400 pixeles
Sabiendo esto podemos ponernos manos a la obra :)

A este DIV lo llamaremos "contenedor", y sería algo asi:
#contenedor {
       width: 900px;
       height: 400px;
}
Nota: en este ejemplo usaremos la hoja de estilo estilos.css que esta vinculada al archivo index.html.

Ahora comenzamos a armar las capas, por ahora solo tenemos que llamar a la capa "contenedor", así:

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

       </div>
</body>
</html>
Ya tenemos el contendor general, ahora maquetaremos la cabecera.

Te gust?

¿Qué es la maquetación?

Maquetando cabecera y barra lateral

 
Información
Christian Valencia publicado porPor: Ero-Fierce

Suscribete
Recibe los ultimos articulos en tu email:


Ultimos Artculos
Hacer SEO en el 2016 - 2017
Habilitar sonido al pulsar las teclas Bloq Mayús, Bloq Num y Bloq Des
10 trucos viejos, seo que nunca te dijeron
15 Efectos carrusel como pagina de libro animado con ejemplos
No se pudo generar una instancia de usuario de SQL Server debido a un error (.mdf
Solucion Error 26. No se encontró el servidor o éste no estaba accesible. Sql

Todos los tutoriales

Hacer una web paso a paso Php y MySQL Javascript
Posicionamiento Web SEO Cómo ganar dinero con tu web Herramientas y Programas Web
Maquetación con CSS Hosting y Dominios MySQL y Phpmyadmin
Ajax UML: Analisis y Diseño Programacion Orientada a Objetos
Java
 
Copyright © 2009 - pagina Web 2 - Todos los derechos Reservados