Inicio HTML, CSS & Layouts Proyecto Final Integrador Responsive Design & Media Queries
Proyecto Final Integrador Teoría ⏱ 1h 30min

Responsive Design & Media Queries

Aprende responsive web design: mobile-first, media queries, breakpoints, imágenes responsivas y clamp().

🚧 Contenido en desarrollo. Próximamente encontrarás aquí la lección completa.

Temas que cubrirás

  • Concepto mobile-first vs desktop-first
  • Viewport meta tag y su importancia
  • Unidades responsivas: %, vw, vh, rem, clamp()
  • @media: sintaxis y breakpoints comunes (480px, 768px, 1024px, 1200px)
  • Combinar media queries con Flexbox y Grid
  • Imágenes responsivas: max-width: 100%, <picture>, srcset, object-fit

Reto

Tomar el dashboard de la Semana 5 y hacerlo completamente responsivo: sidebar colapsable en móvil, cards en una columna, tabla con scroll horizontal.