Share this Page URL

Chapter 9. Applying Styles > The Importance of Location - Pg. 154

Chapter 9 The Importance of Location With so many ways to apply styles, it's not unusual for more than one style rule to apply to the same element. As we discussed in Chapter 1, Web Page Building Blocks, and specifically on pages 42­43, a style's location can break ties in inheritance and specificity. The basic rule is, with all else equal, the later the style appears, the more precedence or importance it has. So, locally applied styles (see page 153) have the most precedence and will override any conflicting styles applied earlier. In a style element, any @import rules present will lose out to any individual style rules that also appear in the style element (since these must follow the @import rules, by definition). <head> <title>La Casa Mil&agrave;</title> <link rel="stylesheet" type="text/css" href="base.css" /> <style> img {border: dashed} </style> </head> Figure 9.19 In this example, the style element comes last. Therefore, the rules it contains will have prece- dence over rules in the base.css style sheet (as long as the conflicting rules have the same inheritance and specificity factors).