Applying External Cascading Style Sheet Formatting

How to:

Use the CLASS Attribute to Apply CSS Formatting

You can apply external cascading style sheet (CSS) formatting to:

A report component (for example, to make a column italic). Assign a cascading style sheet class to the report component using the WebFOCUS StyleSheet CLASS attribute. For information about the CLASS attribute, see Use the CLASS Attribute to Apply CSS Formatting. For information about specifying different types of report components, see Identifying a Report Component in a WebFOCUS StyleSheet..
When formatting a tabular or free-form report, you can format any report component by assigning a CSS class.

When formatting a graph report, you can format the graph heading and footing, and can specify the background color and background image of the page in which the graph appears, in a rule for the BODY element. (Note that when formatting a graph heading or footing, you cannot format individual lines, strings, and field values. If you wish to center a heading or footing, it is recommended that you do so using the CENTER option of the HEADING or FOOTING command, not in a style sheet.)

When working with the WebFOCUS StyleSheet CLASS attribute, you must edit the WebFOCUS StyleSheet using the WebFOCUS text editor.
An entire report (for example, to make the entire report italic). You specify the formatting in the external CSS in a rule for the BODY or TD elements (for graphs, specify the formatting in a rule for the BODY element only. This will format the page in which the graph appears, and the graph heading and footing, but not the graph itself). You must also link the report to the CSS. You do not need a rule for a class of an element, and you do not need a WebFOCUS StyleSheet declaration. For an example, see A CSS Rule for the TD Element.

We recommend that when you use an external cascading style sheet to format a report, you do not also use a WebFOCUS StyleSheet to specify the report formatting, unless you also generate an internal cascading style sheet. For more information, see Combining an External CSS With Other Formatting Methods.

Syntax: How to Use the CLASS Attribute to Apply CSS Formatting

To apply an external cascading style sheet (CSS) class to a report component, use the following syntax in a WebFOCUS StyleSheet declaration

TYPE = type, [subtype,] CLASS = classname, [when,] [link,] $

where:

type

Identifies the report component to which you are applying the class formatting. For tabular and free-form reports, it can be any component, as described in Identifying a Report Component in a WebFOCUS StyleSheet. You cannot specify a component of a graph report: to format a graph's heading and footing, and the background color and background image of the page in which the graph appears, use a rule for the BODY element without a WebFOCUS StyleSheet declaration.

Each report component can be formatted by one class. If you specify several classes for a report component:

The classes that are in declarations with conditional formatting are evaluated first. For each cell in the report component, the first class whose condition is satisfied by the cell row is assigned to the cell.
If none of the conditions is satisfied, or if there are no conditional declarations, the class in the first unconditional declaration is assigned to the report component. All following declarations for that component are ignored.

subtype

Is an optional attribute and value needed to completely specify some kinds of report components. For example, COLUMN and a column identifier are needed to specify a particular report column.

classname

Is the name of the cascading style sheet class whose formatting you are applying to the report component. You can assign the same class to multiple report components.

Class names can be up to 511 characters and are case-sensitive: you must use the same case found in the class rule in the external cascading style sheet. (Note, however, that some web browsers may not enforce case sensitivity.)

when

Is an optional WHEN attribute and value. Supply this if you want to apply the formatting conditionally. For more information, see Formatting Reports: An Overview.

link

Is an optional FOCEXEC, URL, or JAVASCRIPT attribute and value. Supply this if you want to link the report component to another resource, such as a report to which the user can drill down. For more information, see Linking a Report to Other Resources.

For an example, see Applying a CSS Class to ACROSS Values in a Report.