filmov
tv
Clase 2 - Curso de HTML y CSS - Propiedad Position Static, Relative, Absolute, Fixed y Sticky
Показать описание
Repaso:
00:00:00 - CSS – Cascading Styles Sheets (Hojas de estilos en cascada)
00:00:27 - Sintaxis
00:01:15 - ¿Cómo inserto mi Código CSS?
00:03:56 - Variables CSS modernas con el selector :root
00:07:59 - Importar fuente de Google Fonts
00:09:05 - Depuración de codigo en la consola (Tecla F12) : Abre la herramienta de desarrolladores o Dev Tools
00:14:56 - Modelo de Caja o Box Model (No confundir con la propiedad position de los elementos).
00:15:51 - Propiedad Position de elementos: Static, absolute, relative, fixed y sticky.
00:17:55 - Ejercicio Práctico de propiedad positions con cajas o contenedores
00:19:38 - Propiedades offset o desplazamiento: top, right, bottom, left.
🚨 Detalle importante a tener en cuenta 🚨
⚠️ Diferencia de Modelo de caja CSS y la propiedad position
➡️ Modelo de caja: Define cómo se calcula el tamaño y el espacio de los elementos. Incluye el relleno(padding), el borde (border) y el margen (margin) y como se combinan para formar la caja completo de un elemento.
➡️ Propiedad position: Define el método de posicionamiento de un elemento y cómo se coloca en relación con contenedor o la ventana del navegador. Afecta la ubicación de elemento y cómo interactúa con otros elementos, pero no define el tamaño de la caja del elemento ni su espaciado interno o externo.
00:00:00 - CSS – Cascading Styles Sheets (Hojas de estilos en cascada)
00:00:27 - Sintaxis
00:01:15 - ¿Cómo inserto mi Código CSS?
00:03:56 - Variables CSS modernas con el selector :root
00:07:59 - Importar fuente de Google Fonts
00:09:05 - Depuración de codigo en la consola (Tecla F12) : Abre la herramienta de desarrolladores o Dev Tools
00:14:56 - Modelo de Caja o Box Model (No confundir con la propiedad position de los elementos).
00:15:51 - Propiedad Position de elementos: Static, absolute, relative, fixed y sticky.
00:17:55 - Ejercicio Práctico de propiedad positions con cajas o contenedores
00:19:38 - Propiedades offset o desplazamiento: top, right, bottom, left.
🚨 Detalle importante a tener en cuenta 🚨
⚠️ Diferencia de Modelo de caja CSS y la propiedad position
➡️ Modelo de caja: Define cómo se calcula el tamaño y el espacio de los elementos. Incluye el relleno(padding), el borde (border) y el margen (margin) y como se combinan para formar la caja completo de un elemento.
➡️ Propiedad position: Define el método de posicionamiento de un elemento y cómo se coloca en relación con contenedor o la ventana del navegador. Afecta la ubicación de elemento y cómo interactúa con otros elementos, pero no define el tamaño de la caja del elemento ni su espaciado interno o externo.