Dreamweaver Drawing Layout Tables Tutorial_Shang pin China focuses on high quality website construction

The use of table jigsaw puzzle must be realized by precise calculation, as well as splitting or merging cells. To simplify the use of table layout pages, Dreamweaver provides a Layout mode. Using layout tools in this mode, designers can easily draw layout tables and cells on the page, and then modify and move them.

1. Draw layout table

Enterprise website construction Before drawing a layout table, the producer needs to switch to [Layout] mode, such as executing the command [View], [Table Mode], [Layout Mode] (shortcut key Alt+F6).

On the Layout tab, click the Draw Layout Table button. When the cursor changes to a "cross" shape, drag the mouse in the document to create a table with a green border, as shown in Figure 3-11.

The parameter setting of the layout table is different from that of the table. If you select a layout table, you can set the parameter options of the table in the [Properties] panel, as shown in Figure 3-12.

Layout Table Properties

In the [Attribute] panel, the name of "Layout Table" will be displayed, including some setting parameters such as width, color, spacing, etc., as shown in Table 3-4.

Parameter settings for layout tables

2. Draw layout cells

Text and image elements cannot be inserted into the drawn layout table, but layout cells need to be inserted into the layout table. For example, click the Draw Layout Cell button on the Layout tab, move the mouse pointer to the layout table in the editing window, and when the mouse pointer changes to a "cross" shape, drag the mouse to draw the layout cell, as shown in Figure 3-13.

When a layout cell is selected, the parameter options of layout cell attributes will be displayed on the Attribute panel, as shown in Figure 3-14.

Draw Layout Cells

Most of the parameter options of layout cells are the same as those of layout tables. The difference is that there are more alignment setting parameters than the layout table. Generally, alignment parameter values are set for reference objects relative to the layout table, as shown in Table 3-5.
Layout Cell Options and Functions

3. Nested layout table

When the layout table and layout cells already exist in the Layout mode, click the Draw Layout Table button again to draw a layout table in the blank area of the existing layout table, called "Nested Layout Table", as shown in Figure 3-15.

Dreamweaver Drawing Layout Tables Tutorial

Date：2016-08-16 Source: Shangpin China Type: website encyclopedia
Word Size： small medium big

+86 10-60259772