Wie kann ich Inline-Stile „!important' in CSS überschreiben?

Inline-!important-Stile überschreiben

Wenn es um CSS-Stil geht, haben Inline-Deklarationen eine erhebliche Bedeutung. Das Flag !important markiert einen Inline-Stil als kritisch und schwer zu überschreiben. Es gibt jedoch Umstände, unter denen Sie diese Deklaration überschreiben möchten.

Eine häufige Situation ist, wenn Sie einen Inline-Stil festgelegt haben, wie zum Beispiel:

<code class="html"><div style="display: none !important;"></div></code>

Dieses Element wird ausgeblendet Ansicht aufgrund der Anzeige: keine Deklaration. Gibt es eine Möglichkeit, dieses Inline-Styling zu überschreiben und das Element sichtbar zu machen?

Die Antwort:

Ja, es ist möglich, Inline-!important-Deklarationen mit einem ähnlichen zu überschreiben Regel im CSS-Stylesheet. Sie können dies erreichen, indem Sie Folgendes zu Ihrem Stylesheet hinzufügen:

<code class="css">div { display: block !important; }</code>

Diese Regel setzt die Anzeigeeigenschaft für alle div-Elemente auf Blockieren, wodurch die Inline-Deklaration effektiv überschrieben wird und das ausgeblendete div wieder sichtbar wird.

Es ist erwähnenswert, dass Inline-Stile im Allgemeinen trotz der Flagge !important überschrieben werden können. Betrachten Sie das folgende Beispiel:

<code class="html"><p style="color:blue;">I will be blue</p>
<p style="color:blue;" class="override">But I will be red</p></code>

<code class="css">.override {color:red !important;}</code>

In diesem Fall wird der zweite Absatz rot angezeigt und überschreibt die Inline-Deklaration „color:blue“ aufgrund der !important-Regel, die der .override-Klasse hinzugefügt wurde.

Das obige ist der detaillierte Inhalt vonWie kann ich Inline-Stile „!important' in CSS überschreiben?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!