Lenguaje CSS
CSS es un lenguaje de estilos para dotar de apariencia y aspecto visual a una página o sitio web (entre otras cosas). También es conocido como el mayor enemigo de los programadores backend. En esta página te ayudo a aprender a dominarlo.
Comienza a aprender
¿...o prefieres un roadmap?
Comienza a practicar
¿Ya sabes la teoría? ¡Es hora de ponerse a practicar!
La función linear()
Aprende a crear ritmos lineales personalizados con la función linear() de CSS, un nuevo método que permite múltiples fragmentos con diferentes ritmos lineales.
Preferencias de usuario
Dentro del apartado de media queries, podemos especificar ciertas preferencias de usuario, para adaptarnos a las elecciones particulares que han elegido.
Capas de cascada: regla @layer
La regla @layer se puede utilizar para crear capas con código CSS de forma independiente. Posteriormente se pueden funcionar, siguiendo un orden específico.
¿Qué es PostCSS?
PostCSS se define como un preprocesador, transformador y postprocesador de CSS construido con Javascript, pero... ¿Qué es realmente? Te lo explico.
Scroll-driven animations
Aprende a crear efectos de animaciones dirigidas por scroll (Scroll Driven Animations) utilizando CSS, sin necesidad de utilizar Javascript.
TailwindCSS: Clases de utilidad
Conoce las ventajas y desventajas de utilizar TailwindCSS en tus proyectos web y cómo empezar a utilizarlo de manera efectiva
¿Qué es Sass?
Sass es un preprocesador CSS, es decir, un lenguaje que añade características a CSS, ampliándolo con bucles, funciones y otras funcionalidades.
Textos y alineaciones
CSS incorpora gran cantidad de propiedades para modificar el comportamiento de los textos de una página web.
Origen y prioridad CSS
Los orígenes de CSS juegan un papel esencial a la hora de establecer la importancia de ese código y la prioridad respecto a otros códigos CSS
CSS Modules: Estilos modulares
Una forma simple y cómoda de trabajar con CSS en aplicaciones web es utilizar módulos CSS preprocesados. Simplemente añadimos la extensión .module.css a nuestros ficheros y nos aseguramos de estar usando PostCSS. Te lo explico.
El objeto Animation
Con el objeto Animation podemos acceder a una animación concreta, modificarlas o trabajar con ellas.
La funcion scroll() y scroll-timeline
Mediante la función scroll() y la propiedad scroll-timeline podemos crear animaciones dirigidas por scroll y personalizarlas al detalle. Te explico como hacerlo.
CSSStyleSheet: Módulos CSS nativos
Mediante el objeto CSSStyleSheet nativo de Javascript podemos crear algo similar a los estilos locales de CSS Modules, pero sin preprocesar.
Sombras CSS en textos
Si necesitamos crear sombras en textos, tipografías o incluso a veces en iconos, podemos utilizar la propiedad text-shadow.
Reset CSS
Los resets CSS son fragmentos de código predefinidos para resetear los estilos CSS que pone por defecto el navegador.
¿Qué es Browserslist?
Browserslist permite automatizar el grado de compatibilidad de algunas herramientas Javascript/CSS respecto a navegadores antiguos.
¿Qué es la cascada CSS?
La cascada CSS es el conjunto de características que hacen funcionar a CSS en un navegador. Conocer como funcionan es aprender el funcionamiento de CSS.
¿Qué son los trayectos animados?
Mediante una combinación de HTML, CSS y detalles opcionales de SVG, podemos crear trayectos animados. Te explico como funcionan.
Compatibilidad y soporte
En este post exploraremos mecanismos para averiguar la compatibilidad de una característica en diferentes navegadores.
Videos
¿Prefieres contenido de video? ¡Echa un vistazo a mi canal!
¿Quién soy yo?
Soy Manz, vivo en Tenerife (España) y soy streamer partner en Twitch y profesor. Me apasiona el universo de la programación web, el diseño y desarrollo web y la tecnología en general. Aunque soy full-stack, mi pasión es el front-end, la terminal y crear cosas divertidas y locas.
Puedes encontrar más sobre mi en Manz.dev