beautypg.com

Using visual aids for layout – Adobe Dreamweaver CC 2014 v.13 User Manual

Page 276

background image

Using visual aids for layout

To the top

To the top

Set rulers
Set layout guides
Using guides with templates
Use the layout grid
Use a tracing image

Note: The user interface has been simplified in Dreamweaver CC and later. As a result, you may not find some of the options described in this
article in Dreamweaver CC and later. For more information, see

this article

.

Set rulers

Rulers help you measure, organize, and plan your layout. They can appear on the left and top borders of the page, marked in pixels, inches, or
centimeters.

To toggle rulers on and off, select View > Rulers > Show.

To change the origin, drag the ruler-origin icon

(at the upper-left corner of the Design view of the Document window) anywhere on the

page.

To reset the origin to its default position, select View > Rulers > Reset Origin.

To change the unit of measure, select View > Rulers, and then select Pixels, Inches, or Centimeters.

Set layout guides

Guides are lines that you drag onto the document from the rulers. They help you place and align objects more precisely. You can also use guides
to measure the size of page elements, or emulate the folds (visible areas) of web browsers.

To help you align elements, you can snap elements to guides, and snap guides to elements. (Elements must be absolutely positioned in order for
the snap feature to work.) You can also lock guides to prevent them from being accidentally moved by another user.

Create a horizontal or vertical guide

1. Drag from the corresponding ruler.

2. Position the guide in the Document window and release the mouse button (reposition the guide by dragging it again).

Note: By default, guides are recorded as absolute pixel measurements from the top or left side of the document, and are shown relative to
the origin of the ruler. To record the guide as a percentage, press the Shift key while you create or move the guide.

Show or hide guides

Select View > Guides > Show Guides.

Snap elements to guides

To snap elements to guides, select View > Guides > Snap to Guides.

To snap guides to elements, select View > Guides > Guides Snap to Elements.
Note: When you resize elements, such as absolutely-positioned elements (AP elements), tables, and images, the resized elements snap to
guides.

Lock or unlock all guides

Select View > Guides > Lock Guides.

View and move a guide to a specific position

1. Hold the mouse pointer over the guide to view its position.

2. Double-click the guide.

3. Enter the new position in the Move Guide dialog box and click OK.

View the distance between guides

Press Control (Windows) or Command (Macintosh) and hold the mouse pointer anywhere between the two guides.

Note: The unit of measure is the same as the unit of measure used for the rulers.

269

This manual is related to the following products: