For example, in the following style sheet, the div text will be black, even though the first style property applied is red:
div { color: black; }
The !important rule is a way to make your CSS cascade but also have the rules you feel are most crucial always be applied. A rule that has the !important property will always be applied no matter where that rule appears in the CSS document. So if you wanted to make sure that a property always applied, you would add the !important property to the tag. So, to make the div text always red, in the above example, you would write:
div { color: black; }
However, the !important rule was also put in place to help Web page users cope with style sheets that might make pages difficult for them to use or read. Typically, if a user defines a style sheet to view Web pages with, that style sheet will be over-ruled by the Web page author's style sheet. But if the user marks a style as !important, that style will overrule the Web page author's style sheet, even if the author marks their rule as !important.
This is a change from CSS1 to CSS2. In CSS1, author !important rules took precedence over user !important rules. CSS2 changed this to make the user's style sheet have precedence.