1.5

Table Of Contents
How to determine which styles are applied
To see which styles are applied to an element, select the element (see "Selecting an element"
on page377) and take a look at the Styles pane that sits next to the Attributes pane.
The Styles pane shows which CSS style rules apply to the currently selected element.
A link next to a style rule will open the file where that particular style is defined. This can be
either a CSS file or the source file of a section if local formatting was used (see "Styling and
formatting" on page453).
A crossed-out style rule signals that it was overruled by another style rule. This happens when:
l A more specific, and therefore more important rule, is encountered for the same element.
See "Using a more specific CSS rule" below to learn more about the specificity of style
rules.
l A rule with the same importance is read after the first rule. Not only is the order of the rules
in a CSS file important, but also the order in which the style sheets are read. The style
sheets that are included with a section are read in the specified order; see "Determining
the order in which style sheets are read" on the next page.
Using a more specific CSS rule
By default, many CSS properties of an HTML element also apply to the elements inside that
element. For example, a CSS rule that specifies a certain font-type for a box is also applied to
paragraphs in that box. In this example the box is the 'parent' element and the paragraphs are
the 'child' elements that inherit the font-type property of the box.
Note
Although the background color property seems to be inherited, it isn't. Most elements are
transparent; therefore the background color of the parent element shines through.
To replace inherited style properties, you need to add a more specific CSS rule for that (type of)
element. In case of a conflict between a general rule and a more specific rule, the more specific
rule will be applied.
The following diagram shows the order of specificity.
Page 460