What is the !important
statement in CSS?
body {
font-size: 12.5px !important;
}
What is the !important
statement in CSS?
body {
font-size: 12.5px !important;
}
The !important
statement is to force CSS to use the property described in this line.
CSS works by hierarchies, a cascade of rules that obey priorities. For example a property declared in an element directly in HTML takes precedence over a property defined in CSS. In cases of these, and in cases of ambiguity where two rules are equal or competing, using !important
makes that rule where it is present pervalecer.
To be more specific here is a list of priorities, in ascending order (first is less important), of how CSS works. And again, !important
is the exception that overcomes all cases:
Universal selectors , eg:
*{ }
Selector , eg:.minhaClasse{ }
The purpose of !important
is to override the Precedence Rules .
Example of operation:
HTML
<p id="a" class="azul">teste</p>
CSS
#a{ color: red;}
.azul{ color: blue !important;}
Without the !important
it should be red, because ID
is more specific than a class , due to the use of it, it is in blue.
You can learn more about specificity and Precedence rules by taking a look in this tutorial .