1 CSS Estructura

2 Estructura CSS CSS3 permite posicionar los div en la página, float   

3 Estructura CSS CSS3 permite posicionar los div en la página, float y clear Con float el div “flota” a una posición relativa.   

4 Estructura CSS CSS3 permite posicionar los div en la página, float y clear Con clear rompe el esquema del float.   

5 Estructura CSS Uso de float y un div clear que rompe el esquema del float.   

6 Estructura CSS CSS3 permite posicionar los div en la página, mediante position, absoluta, relativa o fija. Con posición absoluta el div sale del flujo del contenido.   

7 Estructura CSS Con posición fija el div no cambia de posición en el escalado del navegador o el scroll en la página.   

8 Estructura CSS Las cajas flexibles, se consigue con un nuevo valor de la propiedad display, (display: flex;) de la caja padre. La orientación se define con flex-direction y puede ser horizontal o vertical, según sea fila o columna. Los elementos flexibles tienen diferentes formas de alinearse y distribuirse justify-content y align-items. Cada uno de los elementos puede ordenarse o los diferentes modos crecer o Reducirse para ocupar el espacio.    No todos los navegadores la soportan y es candidata

9 Estructura CSS La nueva propiedad de cajas flexibles, es la forma más sencilla de controlar el aspecto de las cajas div.    No todos los navegadores la soportan y es candidata

10 Recursos CSS MDN Usando las cajas flexibles CSS https://developer.mozilla.org/es/docs/Web/Guide/CSS/Cajas_flexibles CSS-TRICKS A Complete Guide to Flexbox   

11 CSS Fin del tema

12 Ejercicio Realiza la estructura de una página que contenga todos los elementos que se indican en el siguiente esquema: