Curso de CSS

Dale estilo y vida a la web.

Aprende CSS con ejemplos interactivos y crea proyectos reales.

Mi primer estilo CSS

En esta lección escribirás tu primer código CSS. Verás cómo unos simples estilos pueden cambiar por completo la apariencia de una página web. Escribe el código en el editor y observa el resultado en tiempo real.

Cargando editor...

Resultado

Preparando resultado...

Cambia el valor de background-color en el body y observa cómo cambia el fondo completo de la página.

Explicación

Estos son algunos conceptos básicos de CSS que usamos en el ejemplo:

body

Selector que apunta al elemento <body> de la página.

font-family

Define el tipo de letra que se usaría en el texto.

color

Establece el color del texto.

background-color

Define el color de fondo del elemento.

font-size

Tamaño de la fuente del texto.

padding

Espacio interno entre el contenido y el borde del elemento.

border-radius

Redondea las esquinas de un elemento.

display

Define cómo se muestra el elemento (bloque, en línea, etc.).

Reto rápido

Modifica el código y cambia el color de fondo, el tamaño del título o el estilo del botón.

En esta lección

Ejemplo interactivo
Explicación de cada etiqueta
Cuándo usarlo
Errores comunes

Consejo

Empieza con selectores simples y pocos estilos. Es mejor entender bien cada propiedad antes de usar muchas.

Dato extra

CSS no solo sirve para cambiar colores. También puedes crear animaciones, efectos y diseños completos.

Error común

Olvidar el punto y coma (;) al final de cada propiedad o las llaves { }. Esto puede causar que tus estilos no se apliquen.

Siguiente paso

Ahora que ya creaste tus primeros estilos, aprende sobre selectores para aplicar CSS a más elementos.

Ir a la siguiente lección