Überschreiben von Inline-Stilen mit externem CSS

Bei der Arbeit mit HTML-Markup, das Inline-Stile enthält, kann es vorkommen, dass Sie diese überschreiben müssen Stile mit externem CSS. Die Anwendung regulärer CSS-Regeln funktioniert jedoch möglicherweise nicht immer wie beabsichtigt.

Um Inline-Stile effektiv zu überschreiben, können Sie das Schlüsselwort !important in Ihren CSS-Regeln verwenden. Dieses Schlüsselwort fügt der Regel eine höhere Priorität hinzu, sodass sie auch dann wirksam wird, wenn Inline-Stile vorhanden sind.

Bedenken Sie beispielsweise das folgende HTML-Markup:

 
Wenn Sie versuchen, den Inline-Stil des div-Elements mithilfe der CSS-Regel zu überschreiben:
div {
    color: blue;
}
Der Inline-Stil wird nicht überschrieben. Um sicherzustellen, dass der Inline-Stil überschrieben wird, verwenden Sie das Schlüsselwort !important:
div {
    color: blue !important;
}
Durch das Hinzufügen von !important zur Regel geben Sie ihr eine höhere Priorität gegenüber dem Inline-Stil. Infolgedessen wird der Text im div-Element jetzt in Blau gerendert, obwohl der Inline-Stil die Farbe explizit auf Rot setzt.