Comment puis-je remplacer les styles `!important` en ligne en CSS ?

Remplacer les styles !important en ligne

En ce qui concerne le style CSS, les déclarations en ligne ont un poids important. L'indicateur !important marque un style en ligne comme étant critique et difficile à remplacer. Cependant, dans certaines circonstances, vous souhaiterez peut-être remplacer cette déclaration.

Une situation courante est celle où vous disposez d'un ensemble de styles en ligne, tel que :

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

Cet élément sera masqué de vue due à l'affichage : aucune déclaration. Existe-t-il un moyen de remplacer ce style en ligne et de rendre l'élément visible ?

La réponse :

Oui, il est possible de remplacer les déclarations !important en ligne en utilisant un style similaire règle dans la feuille de style CSS. Vous pouvez y parvenir en ajoutant ce qui suit à votre feuille de style :

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

Cette règle définira la propriété display sur bloquer pour tous les éléments div, remplaçant ainsi la déclaration en ligne et rendant le div caché à nouveau visible.

Il convient de noter que les styles en ligne peuvent généralement être remplacés, malgré l'indicateur !important. Prenons l'exemple suivant :

<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>

Dans ce cas, le deuxième paragraphe apparaîtra en rouge, remplaçant la déclaration color:blue en ligne en raison de la règle !important ajoutée à la classe .override.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!