Dreamweaver

Style Rendering toolbar overview

The Style Rendering toolbar (hidden by default) contains buttons that let you see how your design would look in different media types if you use media-dependent style sheets. It also contains a button that lets you enable or disable CSS styles. To display the toolbar, select View > Toolbars > Style Rendering.

The Style Rendering toolbar

This toolbar only works if your documents use media-dependent style sheets. For example, your style sheet might specify a body rule for print media and a different body rule for handheld devices. For more information on creating media-dependent style sheets, see the World Wide Web Consortium website at www.w3.org/TR/CSS21/media.html.

By default, Dreamweaver displays your design for the screen media type (which shows you how a page is rendered on a computer screen). You can view the following media type renderings by clicking the respective buttons in the Style Rendering toolbar.

Render Screen Media Type
Shows you how the page appears on a computer screen.

Render Print Media Type
Shows you how the page appears on a printed piece of paper.

Render Handheld Media Type
Shows you how the page appears on a handheld device, such as a mobile phone or a BlackBerry device.

Render Projection Media Type
Shows you how the page appears on a projection device.

Render TTY Media Type
Shows you how the page appears on a teletype machine.

Render TV Media Type
Shows you how the page appears on a television screen.

Toggle Displaying Of CSS Styles
Lets you enable or disable CSS styles. This button works independently of the other media buttons.

For a tutorial on designing style sheets for print and handheld devices, see www.adobe.com/go/vid0156.