- Open the style sheet that you want to modify.
-
Complete one of the following sets of steps, depending on whether you want to use the Simplified view or Advanced view in the Stylesheet Editor.
- Simplified The Simplified view is better for new users. It provides an easier way to apply properties to styles, with format options available from a toolbar (similar to the way one would use the Text Format toolbar to change the look topic content without a style). In many cases, only the most common property options are available in the Simplified view (e.g., font, letter/word spacing, paragraph alignment/indentation, auto-numbering format, borders, background). One advantage of the Simplified view is that you can apply a property to multiple styles at the same time. You can also click a check box to hide the properties in the editor, allowing you to see only the styles.
- Advanced The Advanced view displays style classes and properties in hierarchical tree structures. It is not as quick as using the Simplified view, but it allows you to edit a great deal more settings than are available in the Simplified view.
If using the Simplified view:
- In the local toolbar, make sure the first button displays
(which means that the Simplified view is currently shown in the editor). If the button displays
instead, then click it.
- In the upper-left corner of the Stylesheet Editor, make sure the Show Styles field
is set to Show All Styles.
- From the grid in the bottom portion of the editor, find and select the body tag.
-
In the local toolbar, click Add Class.
The New Style dialog opens.
-
Enter a name for the new style class and click OK.
The new class is added under the <body> tag.
- In the grid in the bottom portion of the editor, make sure the new style class is selected.
- In the local toolbar of the editor, click
. The Properties dialog opens.
- Select the Font tab.
- In the Background field, click the down arrow and select a color from the popup. For advanced color options, select More Colors and use the fields in the Color Picker dialog.
- In the Properties dialog, click OK.
If using the Advanced view:
- In the local toolbar, make sure the first button displays
(which means that the Advanced view is currently shown in the editor). If the button displays
instead, then click it.
- In the upper-left corner of the Stylesheet Editor, make sure the Show Styles field
is set to Show All Styles.
- In the Styles section on the left side of the editor, find and select the body tag.
-
In the local toolbar, click Add Class. The New Style dialog opens.
-
Enter a name for the new style class and click OK. The new class is added under the <body> tag.
- In the Styles section, make sure the new style class is selected.
- From the Show Properties drop-down list
on the upper-right side of the editor, select Show: Property Groups.
- In the Properties section, click the plus button
next to Background to expand the group.
- Next to the background-color field, click in the column on the right.
- Click the down arrow and select a color from the popup. For advanced color options, select More Colors and use the fields in the Color Picker dialog.
- Press CTRL+S or click
to save your work.
- Open the topic to which you want to apply the background color.
- If the tag block bars are not shown to the left of the content, click
in the toolbar at the bottom of the editor.
- Right-click the body tag bar (the second bar from the left).
- In the context menu, select Style Class>body.[name of class].
- Press CTRL+S or click
to save your work.