En esta sesión veremos la diferencia entre elementos en línea y en bloque, es decir, por qué algunos elementos como las imágenes ocupan solo una parte del ancho de nuestra pantalla y otros como los párrafos lo ocupan por completo. Aparte de ver las diferencias veremos cómo cambiar el comportamiento por defecto de un elemento en línea para que se muestre en bloque y viceversa.
Otro de los aspectos que tocaremos en esta sesión es el modelo de cajas. Las páginas web se componen de rectángulos formados por elementos que contienen otros elementos. Este método de combinación es al que nos referimos cuando hablamos de modelo de cajas y nos servirá para hacernos una idea de cómo se compone la estructura de una web y cómo podemos pensar en ella combinando elementos que contienen otros elementos a su vez.
Por último, aprenderemos cómo modificar el tamaño de los distintos componentes de una web con las propiedades width, height y overflow que nos permitirán mejorar la estructura visual de un proyecto.
Una de las mejores formas de aprender es revisar el código de nuestras compañeras o el nuestro propio con alguna de ellas para ver que errores encuentra esa persona y aprender cómo podemos corregirlo.
Una vez realizado ese ejercicio de aprendizaje de nuestros errores, la mejor manera de compartirlos e interiorizarlos es escribirlos. De esta forma también podremos consultarlos si en el futuro volvemos a caer en la trampa.
Para ver los errores, os aconsejo que reviseis la página personal junto a alguna de vuestras compañeras y compartais las diferencias y los errores que ha podido cometer la otra persona. Posteriormente podeis apuntar esos errores en el documento que hay compartido en la carpeta de Google Drive y que se llama "Mejoras en la web personal". De ahí sacaremos los errores más frecuentes y los revisaremos en la siguiente sesión.
Para practicar lo aprendido durante esta sesión lo mejor sería realizar los ejercicios del siguiente documento. documento. Si no sabeis realizar alguno no pasa nada pero intentadlo, buscad info en internet y probad, probad y probad, es la mejor forma de aprender. Si no encontrais info en internet podeis preguntarnos cualquier duda.
Para esta sesión, si no habeis terminado esta sección de Khan Academy, lo ideal sería terminarla durante hoy para que el resto de contenido que veamos durante la semana no se os atragante y os sature.
Si alguna quiere continuar hasta "Desafío: coloca al planeta" puede hacerlo pero es recomendable una vez terminadas las lecciones anteriores consultar el resto de recursos y los recursos extra para asentar los conocimientos.
Nota: De momento con llegar hasta la mitad vale, si alguna tiene asentados los conocimientos y quiere continuar puede hacerlo pero sería mejor realizar esta sección después de terminar con los ejercicios propuestos y
El libro de Introducción a CSS sirve muy bien para entender, mediante la lectura, los conceptos dados durante esta sesión. A continuación están listados algunos de los capítulos que van relacionados con el temario de esta sesión y lo explican de forma detallada.
- Libro Introducción a CSS - 5.1. Tipos de elementos
- Libro Introducción a CSS - 4. Modelo de cajas
- Libro de Introducción a CSS - 4.1. Anchura y altura
A continuación aparecen todos los recursos de esta sesión, para tenerlos todos concentrados y que sea más fácil buscarlos:
- Contenido
- Recursos extra