Photoshop y Tutoriales
Blog de diseño
Maquetar 3 columnas con CSS
Aprende a maquetar a 3 columnas con DIV, utilizando CSS. En este tutorial veremos paso a paso como se escribe el codigo necesario css para que tengas una páginas web maquetada a 3 columnas.
En el video te explico para que sirve la propiedad clear:both de CSS, además de presentarte errores comunes de codificación con css al momento que maquetar nuestra página web, acompañado obviamente de la forma de corregir esos errores, mira el video:
En el video te mostré como hacer una página a 3 columnas con css, y utilizamos la propiedad clear:both para que las columnas quedaran todas a la par de la otra.
El clear:right sirve para no dejar nada a la derecha de la capa que estamos, clear:left limpia o no prmite contenido a la izquierda de la capa.
La propiedad Clear es muy importante en CSS, y te permitirá tener todas las DIV quietas en su posición así no tendrás problemas con la alineacion de las capas.
No omito manifestar que si tienes alguna duda con respecto al tutorial puedes dejarla en los comentarios, con mucho gusto te responderé.
Descarga el archivo del video para maquetar con css desde mediafire
Mira el video tantas veces lo creas necesario para aprender y dominar las capas a la perfección, te recomiendo practicar mucho solo la práctica hace al maestro.
Esta es la leccion 23. Si te ha resultado de utilidad, espero tus comentarios
Te podria interesar:
- Plantillas CSS para maquetacion web, gratis +700 CSS layouts
- Como crear un menu de navegacion con CSS
- Introduccion al CSS
- ¿Como crear paginas web que se ajusten al monitor del visitante?
- Como diseñar una pagina web con tablas
Tags: css, curso de diseño web, curso de paginas web, html, maquetar 3 columnas con css
Información Bitacoras.com…
Valora en Bitacoras.com: Esta es la leccion 23 del curso de paginas web, en el que aprenderemos como maquetar una pagina web para que se muestre a 3 columnas utilizando unicamente CSS. En el video te explico para que sirve la propiedad clear:both de …..
Buenisimo!
el intro esta de hueva, recuerden q solo tienen 9 segundos, el visitante se aburra que fue mi caso!!!!!
Lamento que te hayas perdido el tutorial, tomare en cuenta tu experiencia para futuros vdeos, empezando por un intro de menor duracion, gracias por la observacion.
Yo quiero saber si hay alguna forma de conseguir el programa DREAMWEAVER, porfavor?
Puedes descargarlo desde la web de Adobe.com o bien buscarla en taringa.net. Bendiciones
Yoyoyoyoyoyoyo!!! tengo una duda encontre esto!!! http://www.phpform.org/ me sirve para ponerlo en una web??
Peroooooooooooo!!! como hago para k se muestren posteados??? hay algun codigo por ahi k pueda usar???
yo se k ese es el formulario solamente, pero io kiero la funcion u.u' grax
como organizo este codigo para k me funcione???
http://www.comocreartuweb.com/phpBB2/ftopic12894….
creo k es todo gracias y disculpen molestias xD
Si aun no lo has subido a un servidor intentalo, verás como el error desaparece
si sirve para ponerlo en una web, revisa el siguiente tutorial: http://www.photoshopytutoriales.com…
Y te recomiendo ver la categoria Curso de paginas web, donde explico el pao a paso para diseñar una pagina web desde cero usando codigo html.
Que bien, Saludos y Bendiciones
jaja, hechate una barrita toolbar
Pero el tutorial esta muy bueno
Wow, excelente tutorial y el curso es mas completo que el que pagué hace 6 meses, de haberte encontrado antes no habría pagado el curso, en este aprendí mucho más. Felicidades por tu blog y espero que sigas publicando desinteresadamente estos tutoriales que al menos a mi me han sido de mucha utilidad
[...] Maquetar 3 columnas con CSS [...]
Hola, estoy en plena clase de Java, mientras nos enseñan Etiquetas DIV y mi profesor ni se acerca. Gracias a twitter llegué a este site y llegando a casa lo chekeo. Dan ganas de llorar de impotencia al no entender, mucho más si el profesor no te apoya.
en lugar de poner clear:both, porque no usas la propiedad overflow: hidden en el contenedor principal
Buena sugerencia, Saludos