Selecting SPS Components to Style

Any component in the SPS design (except node tags) can be selected for the definition of a style. Components that can be styled are: (i) a static SPS component such as an Auto-Calculation or a text string; or (ii) a predefined format (represented in the Design View by its start and end tags).

•	be of a single component type (for example, a horizontal line component is of the line component type; a (contents) placeholder is of the content component type; a combo box is of the combobox component type);

•	have structurally mandatory component subtypes (for example, a table component will be of the component type table, and will have the mandatory component subtypes body, row, column, and cell, and optionally, the header and footer component subtypes.

2.	Select a component type from the contained component types; this selection is done in the Styles For column of the Styles sidebar.

When an SPS component is selected in the design (by clicking it), its component type is listed in the Styles For column of the Styles sidebar. If multiple components are selected in the design, all components of one component type are listed together in the Styles For column of the Styles sidebar (screenshot below).

In the Styles For column, the selected component types are organized into the following categories (each category separated from the next by a line):

•	Textual components. These include: static text strings entered directly in the SPS (texts); Auto-Calculations (autocalcs); dynamic text which is included in the SPS using the (contents) placeholder (contents); and horizontal lines inserted directly in the SPS (lines).

•	Data-entry devices. These include: input fields (editfields); multiline input fields (multiline editfields);combo-boxes (comboboxes); check boxes (checkboxes); radio buttons (radiobuttons); and buttons (buttons). See Using Data-Entry Devices.

•	Images. These are images inserted in the SPS via the Insert \| Image command.

•	Bookmarks and links. Both bookmarks and hyperlinks are indicated as links. See Bookmarks and Hyperlinks.

•	Predefined formats. All predefined formats (such as div, p, h1, and pre) are indicated as paragraphs. See Predefined Formats.

•	Table components. These include the structural components of a table from the table component type down to the cell component type. Each subtype is differentiated and listed separately.

Note:

The conditional template and condition components are not listed because they are filters. Not being present in the output, they do not need to be styled.

When a component in the SPS design is selected, it is listed by its type in the Styles For column of the Styles sidebar. If multiple components are selected, all instances of a single component type within that selection are listed together and can be styled in one go. In the Styles For column, you can select any one of the listed component types and define styling for all instances of this component type. For example, in the screenshot below, the 51 text components have been selected. You can now define styling in the Styles sidebar for all the selected 51 instances of static text strings. This selection method is useful if a single style definition is required for all instances of a component type within a component.

Note:

If a component type instance is inserted into the design after a style has been defined for that component type, then this instance must either be styled separately or the style definition for the component type must be redone with the newly inserted instance included in the selection.

To define styling for a single component, click the required component to select it. In the case of static text, placing the cursor anywhere within the text string suffices to select it.

Predefined Formats, for a description of predefined formats that can be used in an SPS.

Styles sidebar, for a description of how to work with the Styles Design sidebar.

CSS Support, for information about how to select the required level of CSS support in the browser.