Operation Manual

456

USING DREAMWEAVER

Designing for multiple screens and devices

Last updated 3/28/2012

Note: Changing the site-wide media queries file does not affect documents linked to a different or previous site-wide

media query file.

6 Click Save.

Viewing web pages based on media query

Dimensions specified in a media query appear in the options for Multiscreen button/window size. When you select a

dimension from the menu, the following changes are seen:

• The view size changes to reflect the specified dimensions. The document frame size is unaltered.

• The CSS file specified in the media query is used to display the page.

Change page orientation for mobile devices (CS5.5 and

later)

In most advanced mobile devices, the orientation of a page changes based on how the device is held. When the user

holds the phone vertically, the portrait view is displayed. When the user flips the device horizontally, the page readjusts

itself to fit the landscape dimensions.

In Dreamweaver, the option to view a page in either Portrait or Landscape orientation is available in both Live View

and Design View. Using these options you can test how your page adapts to these settings. You can then, if necessary,

modify your CSS file such that the page is displayed as intended in both these orientations.

❖ Select View > Window Size > Orientation Landscape, or Orientation Portrait.

Creating web applications for mobile devices (CS5.5)

Dreamweaver’s integration with jQuery Mobile helps you quickly design a web application that works on most mobile

devices while adapting itself to the dimensions of the device.