Using Design-Time style sheets

Design-Time style sheets allow you to show or hide design applied by a CSS style sheet as you work in a Dreamweaver document. For example, you can use this option to include or exclude the effect of a Macintosh-only or a Windows-only style sheet as you design a page.

Design-Time style sheets only apply while you are working in the Dreamweaver document; when the page is displayed in a browser window, only the styles that are actually attached to or embedded in the document appear in a browser.

To show or hide a CSS style sheet at design-time:

1. Open the Design-Time Style Sheets dialog box by doing one of the following:
   • Right-click in the CSS Styles panel, and in the context menu select Design-time.
   • Select Text > CSS Styles > Design-time.
2. In the dialog box, set options to show or hide a selected style sheet:
   • To display a CSS style sheet at design-time, click the Plus (+) button above Show Only at Design Time, then in the Select a Style Sheet dialog box, browse to the CSS style sheet you want to show.
   • To hide a CSS style sheet, click the Plus (+) button above Hide at Design-Time, then in the Select a Style Sheet dialog box, browse to the CSS style sheet you want to show.
   • To remove a style sheet from either list, click the style sheet you want to remove, then click the appropriate Minus (–) button.
3. Click OK to close the dialog box.

The CSS Styles panel updates with the selected style sheet’s name along with an indicator, "hidden" or "design," to reflect the style sheet’s status.

Related topics

• Using the CSS Styles panel
• Exporting styles to create a CSS style sheet
• Linking to or importing an external CSS style sheet
• Editing a CSS style sheet