La Web: HTML y CSS
📱 Diseño responsive
Diseña interfaces que funcionan en cualquier pantalla: mobile-first, media queries y unidades fluidas con clamp().
Qué aprenderás
- Activar el responsive con la etiqueta
viewporty aplicar el enfoque mobile-first - Adaptar el layout a distintos anchos con media queries
@media (min-width)y breakpoints - Crear elementos fluidos con
%,rem,vwe imágenes que escalan conmax-width - Escalar la tipografía de forma fluida con
clamp()
Lecciones
El problema y el enfoque mobile-firstPantallas de todos los tamaños, la etiqueta viewport y por qué empezar por el móvil. Media queries y breakpointsLa sintaxis @media (min-width), los breakpoints típicos y su encaje con mobile-first. Unidades y elementos fluidosPorcentajes, rem y vw; imágenes fluidas; tipografía fluida con clamp().Practica este módulo en la app
DevPath es un curso práctico: aquí lees la teoría; en la app la pones en práctica con ejercicios que se ejecutan de verdad, sin conexión.
Empezar gratis en la app →