Style Sheet Configuration Dialog

 

Documentation home

 

 

See also: Working With Web Resources, Style Sheet Editor

 

Style Sheets must be associated with a Page before the styles within that sheet become available to the page; see How CSS Style is Applied for details. Style Sheets can be associated with a Page directly, with a Form, and with a Presentation Template. A form inherits any Style Sheet associations from the presentation template (if the form is linked to one) and a page in turn inherits all the Style Sheet associations from its owning form. At each level, it is possible to disable Style Sheets specified at higher levels.

 

This dialog is available in the Web Resources Section for each of these entities. Its job is to allow Style Sheets to be added, and to manage any inherited associations.

 

SNAGHTML6e04bd08

 

Only those Style Sheet associations which apply to the entity which opens the dialog are shown. The picture above shows the dialog opened from Page Properties, so page, form and template associations are shown. When opened via Form Properties, only Style Sheets for that form and any inherited from a template would be shown. Presentation Template cannot inherit from anywhere else so only Style Sheets associated with it will be shown.

 

Style sheets are included in a web page using <link> tags. These link tags are generated in the order that the Style Sheets appear in this dialog. Style sheets can be moved up or down by clicking on the appropriate buttons, but are always ordered in the following way: presentation template sheets, then form sheets, then page sheets. The ordering of inherited Style Sheets cannot be changed. The relative order of Style Sheets is important when resolving any conflicts in CSS parameters e.g. a class might be defined twice. Standard CSS rules state that when a conflict exists, the last occurrence has precedence.

 

Property

Description

Apply

Click this checkbox to indicate that the Style Sheet should be applied. If a Style Sheet association is disabled (not applied) then it will not be inherited.

Style Sheet

Name of the Style Sheet – this is read only.

From

Shows the level at which the Style Sheet was configured, and is for information only.

 

Style Sheets inherited from higher levels can be disabled by unchecking the Apply checkbox and they can have their Media and Relation properties overridden, but they cannot be completely removed.

Relation

Available options are stylesheet and alternate stylesheet. Alternate Style Sheets, which are not supported by all browsers, provide a technique for allowing the end user to select which Style Sheet should be applied. This is used in conjunction with the Title property.

 

Inherited Style Sheets can have this property overridden. This overridden property is then inherited. Clicking the revert icon in the toolbar will change the properties for an inherited Style Sheet back to its original inherited values.

Media

Specifies the media type. The only types commonly supported by browsers are:

  • all – Style Sheet is always applied
  • screen – used when presenting the document in a screen medium like a computer monitor
  • print – used when printing

 

Multiple media types can be specified. Inherited Style Sheets can have this property overridden. This overridden property is then inherited. Clicking the revert icon in the toolbar will change all the properties for an inherited Style Sheet back to its original inherited values.

Title

Provides a title for the Style Sheet – this is used in conjunction with the Relation property for specifying alternate Style Sheets.

 

Caution! when a title is specified for a Style Sheet with relation stylesheet, this Style Sheet is designated as preferred. Only one preferred Style Sheet is allowed; if you designate more than one preferred Style Sheet, only one will be used and all others will be ignored.

 

Therefore, only specify a value for title when you want to use alternate Style Sheets, and only specify a title for one Style Sheet that has the Relation property set to stylesheet.