Esta es la nota 11 del curso de CSS que se ha ido publicando en este y otros sitios web. Si deseas leer las notas anteriores, aquí te dejo el enlace:
Empezcemos ahora con: El modelo de caja
Si va a utilizar CSS para crear diseños de página web, uno de los primeros temas que es el modelo de caja. El modelo de caja es una forma de visualizar y comprender cómo cada elemento de una página web es una combinación de contenido, relleno, borde y margen.
La comprensión de cómo estas cuatro piezas encajan entre sí es un concepto fundamental que debe ser dominado antes de pasar a otros temas de diseño CSS. Dos grandes lugares para aprender sobre el modelo de caja incluyen:
Una explicación del modelo de caja de la World Wide Web Consortium.
Una introducción al modelo de caja CSS de la red de desarrolladores de Mozilla.
Hay una serie de técnicas y estrategias utilizadas para crear diseños con CSS, y la comprensión del modelo de caja es un requisito previo para cada estrategia. Con el modelo de caja dominado usted estará listo para aprender cómo manipular cajas de contenido en una página web.
La red de desarrolladores de Mozilla ofrece una buena introducción a diseños de CSS. Esta lectura corta cubre los conceptos básicos detrás de diseños CSS, y rápidamente se introduce propiedades tales como text-align, flotador, y la posición.
Una mucho más extensa como una guía en profundidad para diseños de CSS está disponible en el W3C: El modelo de diseño CSS. Este documento es un recurso para los desarrolladores profesionales, por lo que si eres nuevo en CSS tomará su tiempo que lo leas. Esto no es una lectura rápida. Sin embargo, todo lo que necesitas saber sobre la creación de diseños CSS está contenida en el presente documento.
En pocos años, el apoyo a diseños de cuadrícula será parte de la especificación CSS3. Puedes aprender mucho acerca de las cuadrículas al leer sobre el tema en el sitio web del W3C. Para una introducción más ligera y más corta para diseños de cuadrícula, echa un vistazo al artículo de Mozilla sobre este punto.
En pocos años, se espera que la caja flexible CSS3, o Flexbox se converta en el modelo dominante para el diseño de diseños de página web. La especificación Flexbox sin embargo, no es del todo completo y definitivo, y el apoyo a Flexbox no es consistente entre navegadores. Sin embargo, todos los desarrolladores de CSS tiene que estar familiarizado con Flexbox y preparandose para ponerlo en práctica en un futuro próximo. La red de desarrolladores de Mozilla es uno de los mejores lugares para ponerse al día en Flexbox.
Despúes de esta breve explicación, ahondaremos más en el uso de CSS en el diseño web. También te recordamos que estaremos ampliando nuestro curso de Excel, el cual ya habiamos antreiormente a publicar.
