ITCSS

Inverted Triangle architecture for CSS

¿Qué no es ITCSS?

• Un template CSS
• Una librería de componentes
• Un pre-procesador CSS
• Un post- procesador CSS
• Un remplazo de Bootstrap, Fundation...

¿Qué es ITCSS?

• Una arquitectura sana, escalable y manejable
• Una filosofía, no una librería
• Un meta framework, un frameworks para frameworks
• Increíblemente simple

Especificidad CSS

a | b | c |  d

/w3c/specificity/

0 | 0 | 0 | 1

elemento { }

::pseudo-elemento { }

0 | 0 | 1 | 0

.clase { }

[atributo] { }

:pseudo-clase { }

0 | 1 | 0 | 0

#identificador { }

1 | 0 | 0 | 0

style="color: lightcoral"

1 | 0 | 0 | 0 | 0

color: red !important;

0 | 0 | 0 | 0

>, +, *, ~, not()

@media

00010 < 00012

Gráfico de Especificidad

/the-specificity-graph/

/the-specificity-graph/

/specificity-graph/