Wat betekent !important in CSS?

Wat betekent !importantin CSS?

Is het beschikbaar in CSS 2? CSS 3?

Waar wordt het ondersteund? Alle moderne browsers?


Antwoord 1, autoriteit 100%

Het betekent in wezen wat het zegt; dat ‘dit belangrijk is, negeer volgende regels en alle gebruikelijke specificiteitsproblemen, pas dezeregel toe!’

Bij normaal gebruik wordt een regel gedefinieerd in een externe stylesheet overruled door een stijl gedefinieerd in de headvan het document, die op zijn beurt wordt overruled door een in-line stijl binnen het element zelf (uitgaande van gelijke specificiteit van de selectors). Het definiëren van een regel met het !important‘attribuut’ (?) negeert de normale zorgen met betrekking tot de ‘later’ regel die de ‘vroegere’ overschrijft.

Normaal gesproken zal een meer specifieke regel een minder specifieke regel overschrijven. Dus:

a {
    /* css */
}

Wordt normaal overruled door:

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

Aangezien de laatste selector specifieker is (en het maakt normaal gesproken niet uit waar de meer specifieke selector wordt gevonden (in de headof de externe stylesheet), zal het nog steeds overschrijft de minder-specifieke selector (in-line stijlkenmerken zullen altijdde ‘more-‘, of de ‘less-‘, specifieke selector overschrijven omdat het altijdmeer specifiek.

Als u echter !importanttoevoegt aan de CSS-declaratie van de minder specifieke selector, heeft deze prioriteit.

Het gebruik van !importantheeft zijn doelen (hoewel ik er moeite mee heb om ze te bedenken), maar het lijkt veel op het gebruik van een nucleaire explosie om te voorkomen dat de vossen je kippen doden; ja, de vossen zullen worden gedood, maar de kippen ook. En de buurt.

Het maakt het debuggen van je CSS ook een nachtmerrie (vanuit persoonlijke, empirische ervaring).


Antwoord 2, autoriteit 32%

De !belangrijke regel is een manier om je CSS cascade te maken, maar heb ook:
de regels die volgens u het meest cruciaal zijn, worden altijd toegepast. Een regel die heeft
de !belangrijke eigenschap zal altijd worden toegepast, waar dat ook is
regel verschijnt in het CSS-document.

Dus, als je het volgende hebt:

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

de regel met de belangrijkste zal de regel zijn die wordt toegepast (niet meegerekend specificiteit)

Ik geloof dat !importantverscheen in CSS1, dus elke browser ondersteunt het (IE4 tot IE6 met een gedeeltelijke implementatie, IE7+ volledig)

Bovendien is het iets dat u niet vaak wilt gebruiken, want als u met andere mensen werkt, kunt u andere eigenschappen overschrijven.


Antwoord 3, autoriteit 6%

!importantis een onderdeel van CSS1.

Browsers die het ondersteunen: IE5.5+, Firefox 1+, Safari 3+, Chrome 1+.

Het betekent zoiets als:

Gebruik mij als er niets belangrijks in de buurt is!

Kan het niet beter zeggen.


Antwoord 4, autoriteit 3%

Het wordt gebruikt om de sortering in de CSS-cascade te beïnvloeden wanneer op herkomst wordt gesorteerd.
Het heeft niets te maken met specificiteit zoals hier vermeld in andere antwoorden.

Hier is de prioriteit van laag naar hoog:

  1. browserstijlen
  2. declaraties van gebruikersstijlbladen (zonder !important)
  3. auteur stylesheet verklaringen (zonder !important)
  4. !belangrijke stijlbladen voor auteurs
  5. !belangrijke gebruikersstijlbladen

Daarnavindt specificiteit plaats voor de regels die nog een vinger in de pap hebben.

Referenties:


Antwoord 5, autoriteit 2%

Het verandert de regels voor het overschrijven van de prioriteit van css-cascades. Zie de CSS2-specificatie.

Other episodes