In the previous example, we showed how the cascading mechanism gives designer style sheets more weight than user style sheets. Some people consider this unfair, so in CSS, we include two alternatives for letting the user's rules prevail:
In the previous example, the designer's style rules were given more weight than the user's. To do the opposite, we change the user's style sheet as follows:
Adding the keyword !important gives a rule added weight. That rule thereafter overrides the designer's rule for the same property and element. After cascading, the document structure looks like what's shown in Figure 13.8. Figure 13.8. Style properties attached to elements, after cascading and inheritance. This time, the user's rules win.
To keep CSS symmetric, we also allow the designer to mark rules as important. However, the designer's !important does not override the user's !important.
A word of caution: Overriding another style sheet is often much harder than this example indicates. For example, if the designer's style sheet includes color and background rules for the H1 element, the user must also override these rules. To fully override the effect of another style sheet, one must override each and every rule in it. This is difficult to do if you don't know what the incoming style sheet contains. |