162 CHAPTER 4 Getting started with CSS3
FIGURE 4 -7 pecificity value calculation examples, sorted from lowest to highest valueS
If you have conflicting style rules and you calculate the specificity value of each, if the
values are the same, which style rule is used? Textual order becomes the tie breaker. The later
of the style rules will be the effective style.
Understanding inheritance
An element can get its style from a parent element when no other styles are defined that are
more specific, but it’s important to understand that the element only inherits a style from a
parent when no style is defined for the prospective element property. Consider the scenario
in which you want all text in your HTML document to be sized to extra-large. Rather than
define a style for <input> elements, another style for <div> elements, and so on, you can just
set the font of the <body> element as follows.
body {
font-size: x-large;
}
In this example, all elements within the <body> element inherit the font size, but if an ele-
ment is assigned a font size, the assigned font size overrides the inherited size.