About the Web Target style and style sheet editors

Style sheet editors simplify the process for creating cascading style sheets or embedded or inline styles through the use of tabs and property sheets. You can access the following style and style sheet editors in PowerBuilder:

Table 4-1: Style sheet editors available for Web targets

Style sheet editor

How to open

What to use it for

Global

Select Edit>Global Style Sheet when a Web page is open in the HTML editor.

Add links to external files or embedded styles to the current HTML page. Can use to create styles for HTML elements, classes, and IDs.

Standalone

Double-click a CSS file in the System Tree or, when a Web page is not open in the HTML editor, drag and drop a CSS file into the editor area. The Cascading Style Sheet wizard also opens this editor.

Create or modify external files. Can use to create styles for HTML elements, classes and IDs. The external file must be linked to a Web page for these styles to be used by the page.

Inline

Click the Inline Styles tab from the property sheet for any HTML element in the current Web page in the HTML editor. Select the Inline radio button and click Edit.

Create or modify styles for the selected HTML element in the current Web page.

Style sheet components

The style sheet editors inside PowerBuilder are composed of the following components:

Style sheet tree The left pane of the Global Style Sheet editor provides a list of current embedded styles and links to external style sheets, as well as to elements included in embedded style tags. When you add a new element, or selector, it appears in the left pane under the embedded style to which it was added.The left pane of the standalone Style Sheet editor includes a list of all styles in the open style sheet. Imported style sheets are also displayed in the left pane of these style sheet editors.

Style sheet tab pages The right panes of the Global Style Sheet editor and the standalone Style Sheet editor provide a series of tab pages that give you quick access to style attributes. The Inline Styles editor interface is composed entirely of these style sheet tab pages.

The tab pages group similar attributes: font style, margin settings, and so on. When you select attributes for an element, the editor inserts the correct syntax for your style definition.

Style sheet source The standalone Style Sheet editor tab pages include a Source tab page. The other tab pages generate style sheet syntax that you can view in the Source tab page. You can also use this page to copy and paste elements between CSS files.

Support for CSS2

The style sheet editors support styles for both formatting and layout as specified in the CSS2 (Cascading Style Sheets, level 2) specification. Current versions of the Internet Explorer and Netscape browsers implement CSS2.

For information about the CSS2 specification, go to the Web site for the World Wide Web Consortium.