sobreescribir - ¿Qué significa! Importante en CSS?
important css w3schools (5)
La regla! Importante es una forma de hacer que su CSS caiga en cascada, pero también para que las reglas que considera más importantes siempre se apliquen. Una regla que tiene la propiedad! Important siempre se aplicará sin importar dónde aparezca esa regla en el documento CSS.
Entonces, si tienes lo siguiente:
.class {
color:red !important;
}
.outerClass .class {
color:blue;
}
La regla con lo importante será la aplicada (sin contar la specificity ).
Creo que !important apareció en CSS1 por lo que todos los navegadores lo admiten (IE4 a IE6 con una implementación parcial, IE7 + completo)
Además, es algo que no desea utilizar con mucha frecuencia, porque si está trabajando con otras personas, puede anular otras propiedades.
Posible duplicado:
¿Cuáles son las implicaciones de usar “! Important” en CSS?
¿Cómo lees importante en CSS?
¿Qué significa !important en CSS?
¿Está disponible en CSS 2? CSS 3?
¿Dónde se apoya? ¿Todos los navegadores modernos?
Cambia las reglas para anular la prioridad de las cascadas css. Ver w3.org/TR/CSS2/cascade.html#important-rules .
Se utiliza para influir en la clasificación en la cascada CSS cuando se realiza la clasificación por origen. No tiene nada que ver con la especificidad como se indica aquí en otras respuestas.
Aquí está la prioridad de menor a mayor:
- estilos de navegador
- declaraciones de la hoja de estilo del usuario (sin! importante)
- Declaraciones de la hoja de estilo del autor (sin! importante)
- ! importantes hojas de estilo de autor
- ! importantes hojas de estilo de usuario
Después de esa especificidad, las reglas siguen teniendo un dedo en el pastel.
Referencias:
Significa, esencialmente, lo que dice; que ''esto es importante, ignore las reglas subsiguientes, y cualquier problema de especificidad habitual, aplique esta regla''
En el uso normal, una regla definida en una hoja de estilo externa se invalida por un estilo definido en el head del documento, que, a su vez, se invalida por un estilo en línea dentro del propio elemento (asumiendo la misma especificidad de los selectores). Definir una regla con el "atributo" !important (?) Descarta las preocupaciones normales con respecto a la regla "posterior" que prevalece sobre las "anteriores".
Además, normalmente, una regla más específica anulará una regla menos específica. Asi que:
a {
/* css */
}
Normalmente se invalida por:
body div #elementID ul li a {
/* css */
}
Como el último selector es más específico (y no lo hace, normalmente, no importa dónde se encuentre el selector más específico (en la head o en la hoja de estilo externa), seguirá anulando el selector menos específico (los atributos de estilo en línea siempre anule el selector ''más-'' o ''menos-'', ya que siempre es más específico.
Sin embargo, si agrega !important a la declaración de CSS del selector menos específico, tendrá prioridad.
Usar !important tiene sus propósitos (aunque me cuesta pensar en ellos), pero es muy parecido a usar una explosión nuclear para detener a los zorros que matan a tus pollos; Sí, los zorros serán asesinados, pero también lo serán los pollos. Y el barrio.
También hace que la depuración de su CSS sea una pesadilla (desde la experiencia personal, empírica).
!important es una parte de CSS1.
Navegadores que lo admiten: IE5.5 +, Firefox 1+, Safari 3+, Chrome 1+.
Significa, algo como:
Úsame, si no hay nada más importante alrededor!
No puedo decirlo mejor.