Significa, esencialmente, lo que dice; que "esto es importante, ignore las reglas posteriores y cualquier problema de especificidad habitual, ¡aplique esta regla!"
En el uso normal, una regla definida en una hoja de estilo externa es anulada por un estilo definido en el headdocumento, que, a su vez, es anulado por un estilo en línea dentro del elemento mismo (asumiendo la especificidad igual de los selectores). La definición de una regla con el !important'atributo' (?) Descarta las preocupaciones normales con respecto a la regla 'posterior' que anula las 'anteriores'.
Además, normalmente, una regla más específica anulará una regla menos específica. Entonces:
a {/* css */}
Normalmente es anulado por:
body div #elementID ul li a {/* css */}
Como el último selector es más específico (y normalmente no importa dónde se encuentre el selector más específico (en la headhoja de estilo o en la hoja de estilo externa), todavía anulará el selector menos específico (los atributos de estilo en línea siempre anule el selector específico 'más-' o 'menos-', ya que siempre es más específico.
Sin embargo, si agrega !importanta la declaración CSS del selector menos específico, tendrá prioridad.
Usar !importanttiene 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 gallinas; Sí, los zorros serán asesinados, pero también los pollos. Y el barrio.
También hace que depurar tu CSS sea una pesadilla (desde la experiencia personal, empírica).
¡También es confuso para muchos desarrolladores ya que en muchos lenguajes de programación el prefijo! significa no .
rustyx 01 de
19
Uno de los propósitos de! Important sería un script de GreaseMonkey en el que anule deliberadamente el CSS de otras personas que probablemente sea más específico que el suyo.
al menos no es sarcástico y dice important!(importante NO)
user3553260
2
Usted escribió: 'En uso normal, una regla definida en una hoja de estilo externa es anulada por un estilo definido en el encabezado del documento'. Está mal.
jlguenego
130
La regla! Importante es una forma de hacer que su cascada de CSS pero también tenga las reglas que cree que son cruciales siempre se deben aplicar. Una regla que tiene la propiedad! Important siempre se aplicará sin importar dónde aparezca esa regla en el documento CSS.
IE4 +, en realidad, con errores, hasta e inclusive 6.
BoltClock
15
La confusión ocurre ya que !es un símbolo de NO en algunos idiomas, pero ahora es más claro.
Si8
2
Me alegro especialmente de que hayas incluido la sintaxis para usar !important. CSS es lo suficientemente diferente de otros lenguajes que es fácil olvidar cómo usar ciertas cosas.
blainarmstrong
3
@ Si8 - Sí, debido a esa confusión, siempre he pensado que "ellos" deberían haberlo definido como important!, o tal vez IMPORTANT!, en lugar de !important. Me pregunto si alguien (que podría leer esto) sabe por qué lo definieron con la puntuación en frente. Obviamente, es demasiado tarde para cambiarlo ahora.
!importantno se limita solo a Safari 3+; lo ha apoyado desde el principio como todos los demás navegadores que no son IE. IE lo comprende desde la versión 4 en adelante, pero solo lo admite sin errores a partir de la versión 7.
BoltClock
12
Se utiliza para influir en la ordenación en la cascada CSS cuando se realiza la ordenació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 hoja de estilo de usuario (sin! importante)
declaraciones de hoja de estilo de autor (sin! importante)
! importantes hojas de estilo de autor
! hojas de estilo de usuario importantes
Después de eso, tiene lugar la especificidad de que las reglas todavía tienen un dedo en el pastel.
Respuestas:
Significa, esencialmente, lo que dice; que "esto es importante, ignore las reglas posteriores y cualquier problema de especificidad habitual, ¡aplique esta regla!"
En el uso normal, una regla definida en una hoja de estilo externa es anulada por un estilo definido en el
headdocumento, que, a su vez, es anulado por un estilo en línea dentro del elemento mismo (asumiendo la especificidad igual de los selectores). La definición de una regla con el!important'atributo' (?) Descarta las preocupaciones normales con respecto a la regla 'posterior' que anula las 'anteriores'.Además, normalmente, una regla más específica anulará una regla menos específica. Entonces:
Normalmente es anulado por:
Como el último selector es más específico (y normalmente no importa dónde se encuentre el selector más específico (en la
headhoja de estilo o en la hoja de estilo externa), todavía anulará el selector menos específico (los atributos de estilo en línea siempre anule el selector específico 'más-' o 'menos-', ya que siempre es más específico.Sin embargo, si agrega
!importanta la declaración CSS del selector menos específico, tendrá prioridad.Usar
!importanttiene 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 gallinas; Sí, los zorros serán asesinados, pero también los pollos. Y el barrio.También hace que depurar tu CSS sea una pesadilla (desde la experiencia personal, empírica).
fuente
important!(importante NO)Entonces, si tienes lo siguiente:
la regla con lo importante será la aplicada (sin contar la especificidad )
Creo que
!importantapareció 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 usar con bastante frecuencia, porque si está trabajando con otras personas puede anular otras propiedades.
fuente
!es un símbolo de NO en algunos idiomas, pero ahora es más claro.!important. CSS es lo suficientemente diferente de otros lenguajes que es fácil olvidar cómo usar ciertas cosas.important!, o tal vezIMPORTANT!, en lugar de!important. Me pregunto si alguien (que podría leer esto) sabe por qué lo definieron con la puntuación en frente. Obviamente, es demasiado tarde para cambiarlo ahora.!importantes parte de CSS1.Navegadores compatibles: IE5.5 +, Firefox 1+, Safari 3+, Chrome 1+.
Significa, algo como:
¡Úsame si no hay nada más importante alrededor!
No puedo decirlo mejor.
fuente
!importantno se limita solo a Safari 3+; lo ha apoyado desde el principio como todos los demás navegadores que no son IE. IE lo comprende desde la versión 4 en adelante, pero solo lo admite sin errores a partir de la versión 7.Se utiliza para influir en la ordenación en la cascada CSS cuando se realiza la ordenació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:
Después de eso, tiene lugar la especificidad de que las reglas todavía tienen un dedo en el pastel.
Referencias
fuente
!importantes un modificador para el orden en cascada developer.mozilla.org/en-US/docs/Web/CSS/Cascade (consulte la tabla como referencia).Cambia las reglas para anular la prioridad de las cascadas css. Ver la especificación CSS2 .
fuente