Ver Mensaje Individual
  #4 (permalink)  
Antiguo 24/05/2010, 22:24
jcarlosfr
 
Fecha de Ingreso: marzo-2010
Mensajes: 6
Antigüedad: 14 años, 1 mes
Puntos: 1
Respuesta: Divs + CSS (principiante)

Yo si te entiendo lo que tu quieres es una idea basica de como empezar a trabajar con los divs cierto?... pues ahi varias formas con las cuales puedes empezar si eres beginner en esto del maquetado con divs mira:

1.- Con adobe dream weaver ahi una opcion cuando creas un proyecto nuevo en el menu archivo en el cual puedes seleccionar un diseno ya hecho para empezar a trabjar con el que ya tiene disenos maquetados con puros divs y css puro tu puedes separar los estilos con los que se separa este css del codigo html para que veas como esta maquetado que estilos se aplican y todo ese show.

2.- Si ya sabes aplicar estilos pero no sabes como empezar puedes dibujar un mock up como se le dice en el ambito del diseno profesional y puedes crear una estructura basica para guiarte.

3.- Ahora que si no es eso lo que quieres y quieres saber un ejemplo de maquetado pues tambien te pongo este ejemplo:

Imagina que tienes el documento en blanco tu puedes crear un div contenedor padre o wrapper el cual contendra a todos los demas hijos o elementos dentro del documento tu a este contenedor le asignas con un estilo CSS un height y un width especifico para este div.

dentro de este div contenedor incluyes otro div el cual lo puedes utilizar como cabecera todo quedaria de la siguiente forma:

Código HTML:
Ver original
  1.      <head>
  2.           <title>
  3.                maquetado de ejemplo
  4.            </title>
  5.            <style>
  6.                 #contenedor_padre {
  7.                      width: 500px;
  8.                      height: 900px;
  9.                 }
  10.                 #cabecera {
  11.                     width: 100%;
  12.                     height: 90px;
  13.                     border: 1px solid red;
  14.                 }
  15.            </style>
  16.      </head>
  17.     <body>
  18.         <div id="contenedor_padre">
  19.             <div id="cabecera">
  20.                  hola este es la cabecera!
  21.             </div>
  22.         </div>
  23.     </body>

En lo sucesivo al asignar al estilo con id cabecera estamos dandole un id de cien po ciento para que se expanda en todos los limites del padre y si agregamos un nuevo div debajo de este aparecera debajo de la cabecera si quieres agregar digamos tres columnas debes agregar tres divs abajo de la cabecera y darles un width y un height especifico y nada mas utilizarias un solo tipo de estiloo y ya lo demas es cuestion de ir lo maquetando a tu gusto utilizando css te recomiendo que entres a la pagina de [URL="http://www.w3schools.com/css/"]http://www.w3schools.com/css/[/URL] si tienes cualquier duda asmelo saber.