¿Quieres aprender CSS? Aquí puedes ver una hoja de ruta para desarrolladores donde podrás aprender de cero a cien todo lo relacionado con este lenguaje de estilos. En el video puedes ver un resumen de todo lo que vas a poder ver en este artículo:
Paso a paso vas a poder ir viendo más de 60 recursos gratis agrupados según el nivel de CSS. Ahí lo tienes:
1.- Fundamentos CSS 1.0
1.1.- Cómo el navegador analiza HTML/CSS3
Cómo funcionan los navegadores -> en inglés
1.2.- Cómo añadir CSS a una página web
Formas de añadir CSS en una página web -> en inglés
1.3.- Sintaxis: selector, bloque de declaración, propiedad, valor declarado
Declaraciones de CSS -> en español
1.4.- Selectores básicos: universal, type, class, id, attribute
Todos estos artículos están escritos en español.
Selectores de tipo, clase e ID
1.5.- Cascada y especificidad: cómo resolver una declaración CSS en conflicto
1.6.- Herencia entre elementos
Video para entender como funciona la herencia en CSS -> en inglés
Herencia en CSS -> en castellano
2.- Fundamentos CSS 2.0
2.1.- Cómo funciona el modelo de caja
The CSS Box Model -> en inglés
2.2.- Conozce los diferentes tipos de cajas
2.3.- ¿Cómo dimensionar los elementos CSS?
2.4.- Aprende las propiedades de relleno, margen, ancho, alto y borde
2.5.- ¿Cómo aplicar estilo al texto?
Using CSS custom properties (variables)
3.- Fundamentos CSS 3.0: Capas
3.1.- Conozce la diferencia entre las propiedades de posición: absoluta, relativa, fija, estática y fija
CSS Layout – The position Property
3.2.- Aprende flexbox, grid, floats
CSS Flexbox: aprende paso a paso
3.3- Práctica: comienza a crear diseños más pequeños, como barras de navegación, y desarrolla tus habilidades a partir de ahí
4.- Fundamentos css 4.0: selectores avanzados
4.1.- Selector de agrupación: lista de selectores
4.2.- Selectores de combinador: descendiente, hijo, hermano general, hermano adyacente, columna
4.3.- Pseudo selectores: pseudo clases, pseudo elementos
Pseudo-classes and pseudo-elements
5.- CSS intermedio: media queries
5.1.- Conozce los media types
5.2.- Comprende cuando se usa el ancho mínimo y el ancho máximo
Media Queries Demystified: CSS Min-Width and Max-Width
5.3.- Aprende el primer enfoque móvil
5.4.- Cómo encontrar y establecer los screen breakpoints
5.5.- Práctica: crea una navegación responsive
How TO – Responsive Top Navigation
6.- CSS intermedio: transiciones y animaciones
6.1.- Aprende las propiedades de la transición
CSS Transition Tutorial – CSS Full Tutorial
6.2.- Cómo aplicar transiciones en pseudoclases
An Interactive Guide to CSS Transitions
6.3.- Aprende de algunos ejemplos
6.4.- Crea animaciones básicas
7.- CSS intermedio: metodologías – BEM
7.1.- Descubre por qué deberías de considerar BEM
7.2.- Aprende qué es un bloque, elemento y modificador
8.- CSS avanzado: preprocesadores SAAS
8.1.- Variables
8.2.- Anidamiento
Sass Nested Rules and Properties
