Operation Manual

167
USING DREAMWEAVER
Laying out pages with HTML
Last updated 3/28/2012
3 In the Page Properties dialog box, specify the transparency for the image by dragging the Image Transparency
slider, then click OK.
To switch to another tracing image or change the transparency of the current tracing image at any time, select
Modify
> Page Properties.
Show or hide the tracing image
❖ Select View > Tracing Image > Show.
Change the position of a tracing image
❖ Select View > Tracing Image > Adjust Position.
• To precisely specify the position of the tracing image, enter coordinate values in the X and Y text boxes.
• To move the image 1 pixel at a time, use the arrow keys.
• To move the image 5 pixels at a time, press Shift and an arrow key.
Reset the position of the tracing image
❖ Select View > Tracing Image > Reset Position.
The tracing image returns to the upper-left corner of the Document window (0,0).
Align the tracing image to a selected element
1 Select an element in the Document window.
2 Select View > Tracing Image > Align with Selection.
The upper-left corner of the tracing image is aligned with the upper-left corner of the selected element.
Presenting content with tables
About tables
Tables are a powerful tool for presenting tabular data and for laying out text and graphics on an HTML page. A table
consists of one or more rows; each row consists of one or more cells. Although columns aren’t usually explicitly
specified in HTML code, Dreamweaver enables you to manipulate columns as well as rows and cells.
Dreamweaver displays the table width and the column width for each table column when the table is selected or when
the insertion point is in the table. Next to the widths are arrows for the table header menu and the column header
menus. Use the menus for quick access to common table-related commands. You can enable or disable the widths and
menus.
If you do not see a width for the table or for a column, then that table or column does not have a specified width in the
HTML code. If two numbers appear, then the visual width as it appears in Design view doesn’t match the width
specified in the HTML code. This can happen when you resize a table by dragging its lower-right corner or when you
add content to a cell that’s larger than its set width.
For example, if you set a column’s width to 200 pixels and then add content that stretches the width to 250 pixels, two
numbers appear for that column: 200 (the width specified in the code) and (250) in parentheses (the visual width of
the column as it’s rendered on your screen).
Note: You can also lay out your pages using CSS positioning.