Using Cascading Style Sheets

How to:

You can use Cascading Style Sheets while developing WebFOCUS Maintain forms. Cascading Style Sheets enable you to format the appearance of your forms using one separate file, rather than having the formatting information appear through all of your files.

The formatting information for a form or control comes from one of three places, in the following order of precedence:

  1. Set its value explicitly in the property sheet. This value takes precedence over any other setting.
  2. Apply a style sheet to your form and apply a class to any control in your form. The control will use the characteristics of the class, as defined in the style sheet.
  3. Apply a style sheet to your form (but do not apply any classes to the controls). The form and controls will use the default characteristics defined in the style sheet.

You can use all of these types of styling in the same Maintain form, allowing for powerful and flexible styling capabilities.

Top of page

Procedure: How to Set a Style Sheet Using the Properties Sheet

You can apply a style sheet using the CSSName property in the Properties sheet of the form.

  1. Click on the form to display its properties in the property sheet.
  2. Enter the name of the style sheet as the value for the CSSName property. Enter the .css extension as part of the value.

    Note: The referenced style sheet must be included in your project.

Top of page

Syntax: How to Apply a Style Sheet to Your Form

To apply a style sheet to your form using Maintain code, place the following in your procedure:

Winform Show_Inactive form 
Winform Set form.CSSname TO stylesheet;
Winform Show form

The form and all the controls in the form that have their properties set to Default, except for the Grids, use the default settings from the style sheet.

Top of page

Syntax: How to Apply a Class to a Control on Your Form

Assuming you have already applied a style sheet to your form, you can apply a class to any control on your form using the following syntax:

Winform Set form.control.CSSCLASS TO classname;

The control inherits the characteristics of the class as specified in the style sheet. This means that all of the properties of that control that are set to Default use the setting for that class in the style sheet.