Combining an External CSS With Other Formatting Methods

Topics:

Combining an External CSS With a StyleSheet

When you use an external cascading style sheet (CSS) to format a report, you can use other formatting methods at the same time. Some of these other methods are subject to restrictions. The other methods that you can use with an external CSS are:

StyleSheets. An effective way of combining an external CSS with a StyleSheet is to link to an external CSS to provide default formatting, and use a StyleSheet to override those defaults for individual report components. Note that if you combine a StyleSheet and an external cascading style sheet, you should generate an internal cascading style sheet to avoid reducing the performance benefits associated with an external CSS.
Do not attempt to format the same property of the same report component using both an external CSS class (through the CLASS attribute) and a StyleSheet attribute, since the two formatting instructions could conflict with each other.

For complete instructions about using an external CSS with a StyleSheet, see Combining an External CSS With a WebFOCUS StyleSheet.
TABLE language instructions. You can use TABLE language formatting instructions, such as HEADING CENTER, PAGE-BREAK, and spot markers (for example, </3). However, you should not apply both a TABLE language instruction, and an external cascading style sheet rule, to perform the same formatting on the same report component, because they might conflict with each other.
For example, you should not specify both of the following for the same report:
- HEADING CENTER in the report request.
- Text-align in an external CSS, applied to the report page heading.
Both of these will attempt to align the report page heading.

Combining an External CSS With a StyleSheet

When you use an external cascading style sheet (CSS) to format a report, you can use a StyleSheet at the same time. You may do this with or without generating an internal cascading style sheet.

An effective way of doing this is to link to an external CSS to provide default formatting, and use a StyleSheet to override those defaults for individual report components. The cascading style sheet BODY or TD rule will provide the default formatting for the report. If you wish, you can override the defaults for individual report components via native StyleSheet attributes. This enables you to conform to your organization's formatting standards as they are implemented in a CSS, while allowing you to customize those standards for reports using StyleSheet attributes. For information about using a BODY or TD rule for default formatting, see Choosing a Cascading Style Sheet Rule. For an example, see Inheritance and External Cascading Style Sheets.

Performance considerations. Note that, unless you generate an internal cascading style sheet from the StyleSheet, combining an external CSS and a StyleSheet may reduce the performance benefits associated with the external CSS. This is because a report that uses both an external CSS and native StyleSheet attributes generates more HTML code than the same report using an external CSS alone, although it still generates less code than if the report had used native StyleSheet attributes alone. (Reducing the amount of generated HTML code can reduce network load and browser display time.) For information about generating an internal cascading style sheet, see .

You cannot double-format. You should not attempt to format the same property of the same report component using both an external CSS class (via the CLASS attribute) and a StyleSheet attribute, since the class and the StyleSheet attribute could conflict with each other.

For example, you should not include the following declarations in the same StyleSheet because they would both try to assign a color to the Country column:

TYPE=Data, COLUMN=Country, COLOR=Orange, $
TYPE=Data, CLASS=TextColor, $

You can specify classes and StyleSheet attributes that format different properties of the same report component, and that format different report components. For example, the following declarations are acceptable in the same StyleSheet:

1. TYPE=Heading, COLOR=Green, $ 
1. TYPE=Heading, CLASS=HeadingFontSize, $ 
2. TYPE=Data, Column=Country, BACKCOLOR=Yellow, $ 
2. TYPE=Data, Column=Car, CLASS=DataBackgroundColor, $

These two declarations are compatible because they format different properties (color and font size).
These two declarations are compatible because they format different report components (the Country column and the Car column).

	WebFOCUS