Aprender CSS - Curso Code

Aprende CSS paso a paso, desde tu primer selector hasta los diseños adaptables, las animaciones y el diseño web moderno. Escribe una línea de CSS y observa cómo cambia la página en tu teléfono: el editor muestra tu HTML y CSS uno al lado del otro con una vista previa en directo.

Este tutorial de CSS está pensado para principiantes y crece contigo. Cada curso trata un tema real, cada lección es breve y el editor está siempre a un toque de distancia, para que practiques lo que acabas de leer en lugar de limitarte a leer sobre ello.

QUÉ INCLUYE

• 40 cursos y 159 lecciones breves, desde principiante (A1) hasta avanzado (C1)

• Un editor de HTML y CSS en directo con vista previa instantánea, para hacer pruebas rápidas y crear tus propias páginas

• 20 proyectos guiados de diseño web, paso a paso: una barra de herramientas, una cuadrícula de tarjetas, un encabezado fijo, un botón pulsante y mucho más

• 20 misiones de búsqueda de errores: una tarjeta 42px más ancha que su columna, una media query que nunca se activa en un teléfono, un modal atrapado detrás de la página

• Un examen final y un certificado de finalización

• La aplicación está disponible en 22 idiomas

UN RECORRIDO COMPLETO, DE PRINCIPIANTE A AVANZADO

• Sintaxis y selectores, colores, fondos y tipografía

• El modelo de caja, display, posicionamiento, unidades y valores

• Pseudoclases y pseudo-elementos

• Fundamentos de Flexbox y Flexbox avanzado

• Fundamentos de Grid, áreas de grid y diseño avanzado con grid

• Diseño adaptable, media queries y container queries

• Propiedades personalizadas (variables), funciones, especificidad, la cascada y @layer

• Transiciones, transformaciones, animaciones con fotogramas clave, filtros y modos de fusión

• Modo oscuro y esquemas de color, desplazamiento y overflow, clip-path y formas

• Depuración con DevTools, arquitectura BEM, Sass, PostCSS y tokens de diseño

• Patrones de componentes, patrones de diseño modernos, rendimiento y Houdini

UNA PRÁCTICA QUE SE CONSOLIDA

• Cuestionarios para comprobar lo que has aprendido

• Una guía rápida con 69 entradas sobre propiedades, selectores y sintaxis de diseño

• 50 preguntas de entrevista con respuestas claras, útiles antes de una entrevista para un puesto de frontend o desarrollador web

• Una biblioteca de código con ejemplos breves que puedes abrir y editar

• Guarda tu propio código, tus notas y tus lecciones favoritas

• World Coding Challenge: tres rondas globales al día, resueltas en Python, JavaScript y otros lenguajes

• Rachas, XP, una clasificación y recordatorios diarios para mantener tu práctica

MENTOR DE AI

• ¿Te has atascado con un diseño o una propiedad? Pregunta al mentor de AI sobre un concepto, un error o tu propio código

• Zona de pruebas de AI: describe una página y observa cómo se construyen el HTML y el CSS

• Los usuarios gratuitos reciben una cuota diaria de AI; Pro la hace ilimitada

PARA QUIÉN ES

• Principiantes absolutos que dan sus primeros pasos en el desarrollo web

• Diseñadores que quieren diseñar sus propias páginas en lugar de entregar maquetas

• Estudiantes que quieren practicar más junto a un curso de diseño web

• Desarrolladores que conocen algo de HTML y CSS y por fin quieren entender Flexbox y grid

• Personas que cambian de profesión y se preparan para un puesto de frontend

GRATUITA Y PRO

El primer curso, el primer proyecto guiado, dos misiones y el editor en directo son gratuitos, con una cuota diaria de mentor de AI. Pro desbloquea todos los cursos, todos los proyectos y misiones, el examen del certificado y AI ilimitada, y elimina los anuncios.

Empieza hoy, aprende CSS a tu ritmo y diseña tu primera página en cuestión de minutos.