Learn CSS

Style your website and make it stand out with our CSS tutorials. From basic layouts to advanced effects and animations, we'll help you level up your design skills.

All CSS content:

  1. Fundamentos de CSS: Comprensión del colapso de márgenes

    Fundamentos de CSS: Comprensión del colapso de márgenes

    Tutorial Beginner

    Los elementos son los bloques de construcción de las páginas web: al crear sitios web, en realidad estás "colocando ladrillos" de elementos. Cuando se...

  2. Comprendiendo la herencia en CSS (Inherit, Initial, Unset y Revert)

    Comprendiendo la herencia en CSS (Inherit, Initial, Unset y Revert)

    Tutorial Beginner

    Existen relaciones en HTML, y estas relaciones nos permiten seleccionar y aplicar estilo a los elementos de una página web. Cuando un elemento HTML se...

  3. Cómo usar la nueva ":is()" de CSS para focalizar elementos fácilmente

    Cómo usar la nueva ":is()" de CSS para focalizar elementos fácilmente

    Tutorial Beginner

    La nueva pseudo-clase CSS :is() se perfila para convertirse en una gran manera de focalizar elementos, ahorrar líneas y líneas de código y mantener el CSS...

  4. Desmitificando las pseudo-clases en CSS (:nth-child vs. :nth-of-type)

    Desmitificando las pseudo-clases en CSS (:nth-child vs. :nth-of-type)

    Tutorial Beginner

    Los estilos se aplican a una página web usando selectores de CSS; los selectores te permiten enfocarte en un elemento o conjunto de elementos específicos....

  5. Cómo crear un componente de acordeón con el truco Checkbox  de CSS

    Cómo crear un componente de acordeón con el truco Checkbox de CSS

    Tutorial Intermediate

    En este breve tutorial, aprenderemos a crear un componente de acordeón flexible usando solo CSS y aprovechando «la técnica con el truco checkbox de CSS». Y...

  6. ¿Qué es la especificidad de CSS y cómo funciona?

    ¿Qué es la especificidad de CSS y cómo funciona?

    Tutorial Beginner

    Al trabajar con CSS, los estilos en conflicto pueden ser una fuente constante de problemas, especialmente cuando no sabes en dónde se encuentra el origen...

  7. Efectos hover con CSS: Técnicas para crear un texto con "relleno barrido"

    Efectos hover con CSS: Técnicas para crear un texto con "relleno barrido"

    Tutorial Beginner

    En el tutorial de hoy, aprenderemos dos técnicas diferentes para crear un efecto de texto con "relleno barrido" al pasar el ratón sobre él. Incluso iremos un...

  8. 7 Unidades CSS De las Que Tal Vez No Sepas

    7 Unidades CSS De las Que Tal Vez No Sepas

    Tutorial Beginner

    Es fácil atorarse trabajando con las técnicas CSS que conocemos bien, pero hacerlo nos pone en desventaja cuando surgen nuevos problemas.

  9. Cómo crear un formulario responsivo usando TailwindCSS

    Cómo crear un formulario responsivo usando TailwindCSS

    Tutorial Beginner

    Al trabajar con HTML y CSS, el enfoque aceptado para crear sitios web es escribir la estructura en el archivo HTML e implementar los estilos en un archivo...

  10. Posicionamiento fijo solo con CSS

    Posicionamiento fijo solo con CSS

    Tutorial Intermediate

    Fijar elementos mediante posicionamiento Sticky, cuando el usuario se desplaza y alcanza determinado punto, se ha convertido en un patrón muy común en el...

  11. Cómo hacer un diagrama de Gantt con JavaScript y CSS

    Cómo hacer un diagrama de Gantt con JavaScript y CSS

    Tutorial Intermediate

    En nuestras series de tutoriales sobre CSS, hemos aprendido a crear varios tipos de gráficos. Hoy aprenderemos cómo hacer un diagrama de Gantt con JavaScript.

  12. Crea un portafolio estático con un gráfico de barras avanzado en CSS

    Crea un portafolio estático con un gráfico de barras avanzado en CSS

    Tutorial Intermediate

    En una publicación previa, te enseñé cómo crear una hermosa página de portafolio a pantalla completa. Durante ese tutorial, también aprendimos a crear un...