1.7

Note
Note: Elements can have multiple classes. Separate the class names with a space
(eg. “red small”).
Alternatively, after selecting an element, you can click the Source tab at the bottom of the
workspace. The selected element will be highlighted in the source. Add the class or classes
and/or the ID to the opening tag of the HTML element, for example: <p class=”intro”>.
How to determine which styles are applied
To see which styles are applied to an element, select the element (see "Selecting an element"
on page121) 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 page186).
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 page195.
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.
Page 193