O que significa importante em CSS?

Duplicar Possível:
Quais são as implicações de usar “! Importante” em CSS?
Como você lê importante em CSS?

O que significa !important em CSS?
É para css2, css3, apenas no IE?

Significa, essencialmente, o que diz; que ‘isso é importante, ignore regras subseqüentes e quaisquer problemas de especificidade usuais, aplique esta regra!’

No uso normal, uma regra definida em uma folha de estilo externa é anulada por um estilo definido no head do documento, que, por sua vez, é sobreposto por um estilo in-line dentro do próprio elemento (assumindo a mesma especificidade dos seletores). Definir uma regra com o “atributo” !important (?) Descarta as preocupações normais no que diz respeito à regra “posterior” sobreposta às regras “anteriores”.

Além disso, normalmente, uma regra mais específica replaceá uma regra menos específica. Assim:

 a { /* css */ } 

Normalmente é anulada por:

 body div #elementID ul li a { /* css */ } 

Como o último seletor é mais específico (e não importa, normalmente, onde o seletor mais específico é encontrado (no head ou na folha de estilo externa) ele ainda irá sobrescrever o seletor menos específico (os atributos de estilo in-line serão sempre substitua o seletor “mais” ou “menos” específico, pois é sempre mais específico.

Se, no entanto, você adicionar !important para a declaração CSS do seletor menos específico, ele terá prioridade.

Usar o !important tem seus propósitos (embora eu tenha dificuldade em pensar neles), mas é muito parecido com o uso de uma explosão nuclear para impedir que as raposas matem suas galinhas; sim, as raposas serão mortas, mas também as galinhas. E o bairro.

Isso também torna a debugging do seu CSS um pesadelo (da experiência pessoal, empírica).

A regra importante é uma maneira de tornar sua CSS cascata, mas também ter as regras que você considera mais cruciais sempre aplicadas. Uma regra que tenha a propriedade! Important sempre será aplicada, não importa onde essa regra apareça no documento CSS.

Então, se você tem o seguinte:

 .class { color:red !important; } .outerClass .class { color:blue; } 

a regra com o importante será aquela aplicada (sem contar a especificidade )

Eu acredito !important apareceu em CSS1 para cada navegador suporta (IE4 para IE6 com uma implementação parcial, IE7 + completo)

Além disso, é algo que você não quer usar com muita frequência, porque se você estiver trabalhando com outras pessoas, poderá replace outras propriedades.

!important é uma parte do CSS1.

Navegadores que o suportam: IE5.5 +, Firefox 1+, Safari 3+, Chrome 1+.

Isso significa algo como:

Use-me, se não houver nada mais importante por aí!

Não posso dizer melhor.

Ele é usado para influenciar a sorting na cascata CSS quando a sorting por origem é feita. Não tem nada a ver com especificidade como declarado aqui em outras respostas.

Aqui está a prioridade do menor para o maior:

  1. estilos de navegador
  2. declarações de folha de estilo do usuário (sem! importante)
  3. declarações de folha de estilo de autor (sem! importante)
  4. folhas importantes de estilo de autor
  5. ! folhas de estilo de usuário importantes

Depois que a especificidade ocorre para as regras ainda com um dedo na torta.

Referências:

Altera as regras para replace a prioridade das cascatas css. Veja as especificações do CSS2 .