Linking to an External Cascading Style Sheet

Topics:

To format a report using an external cascading style sheet (CSS), you must link the cascading style sheet to the report in one of the following ways:

Using the CSSURL Attribute and Parameter

How to:

You can link an external cascading style sheet (CSS) to a report using the CSSURL WebFOCUS StyleSheet attribute or the CSSURL SET parameter. To choose between them, consider the advantages of:

  • An attribute. Using CSSURL as a StyleSheet attribute enables you to specify:
    • A longer URL, since the maximum URL length is 255 characters in the attribute, compared with 69 characters in the parameter.
    • All formatting information in one place, since you can specify the link to the external CSS and the references to CSS classes within the WebFOCUS StyleSheet. This makes it easier for you to maintain your formatting logic.
  • A SET parameter. Using CSSURL as a SET parameter enables you to quickly redirect a link (from one CSS to another) for many reports at once. You do this by putting the SET CSSURL command in its own procedure, and merging that into report procedures using a -INCLUDE Dialogue Manager statement in each report procedure.

If you specify CSSURL in several ways, the specification with the most local scope takes precedence. The order of precedence, from highest (1) to lowest (3), is:

1. TYPE=REPORT, CSSURL = url 
2. ON TABLE SET CSSURL url 
3. SET CSSURL = url

For more information about the CSS attribute, see Use the CSSURL Attribute to Link to an External CSS. For more information about the CSS parameter, see Use the CSSURL Parameter to Link to an External CSS.

Syntax: How to Use the CSSURL Attribute to Link to an External CSS

To link an external cascading style sheet (CSS) to report using a WebFOCUS StyleSheet attribute, use the following syntax

[TYPE=REPORT,] CSSURL=css_url, $

where:

TYPE=REPORT

Specifies that this attribute is being applied to the entire report. If it is omitted, the StyleSheet declaration defaults to it.

css_url

Is the URL of the external cascading style sheet. If the external CSS resides on a web server platform that is case-sensitive, you must specify it using the correct case.

The URL can be up to 255 characters. If your external cascading style sheet URL exceeds this limit, you can shorten the URL by defining an alias (also known as a virtual directory) on the web server to represent part of the path.

You can specify an absolute or relative URL. If it is relative, the external CSS must reside on the web server used by WebFOCUS.

Example: Linking to an External Cascading Style Sheet Using the CSSURL Attribute

This report displays the products currently offered by Gotham Grinds. It is formatted using an external cascading style sheet (CSS), and links to the CSS using the CSSURL attribute in the WebFOCUS StyleSheet:

TABLE FILE GGPRODS
HEADING
"</1 Current Products</1"
PRINT PRODUCT_DESCRIPTION UNIT_PRICE
BY PRODUCT_ID
ON TABLE SET PAGE-NUM OFF
ON TABLE SET ONLINE-FMT HTML
ON TABLE SET STYLESHEET * 
TYPE=REPORT, CSSURL=http://websrv2/css/report01.css, $ 
TYPE=HEADING, CLASS=headText, $
TYPE=TITLE, CLASS=reportTitles, $
TYPE=DATA, CLASS=lowCost, WHEN=N3 LT 27, $
ENDSTYLE
 
END

The request produces this report:

Syntax: How to Use the CSSURL Parameter to Link to an External CSS

To link an external cascading style sheet (CSS) to a report using a SET parameter, issue the following SET command in a procedure

SET CSSURL = css_url

or the following ON TABLE SET command in a report request

ON TABLE SET CSSURL css_url

where:

css_url

Is the URL of the external cascading style sheet. If the external CSS resides on a web server platform that is case-sensitive, you must specify it using the correct case.

The URL can be up to:

  • 69 characters long in a SET command.
  • 57 characters long in an ON TABLE SET command.

If your external cascading style sheet URL exceeds this limit, you can shorten the URL by defining an alias (also known as a virtual directory) on the web server to represent part of the path.

You can specify an absolute or relative URL. If it is relative, the external CSS must reside on the web server used by WebFOCUS.

For an example, see Linking to the ReportStyles External Cascading Style Sheet.

If you specify CSSURL multiple times, the last value specified using ON TABLE SET overrides all the other values within that report request. If CSSURL is not specified within a report request, the last value specified using SET overrides all the others.

For general information about using SET commands, see Customizing Your Environment in the Developing Reporting Applications manual.

WebFOCUS

Feedback