Dreamweaver 4 concise tutorial (7. Web page layout 4)

Author：Eve Cole Update Time：2009-05-30 18:35:45

7. Web page layout

New typesetting function

The reason why I mentioned the function of exchanging layers and tables in one go is because in DW4, a new Layout function was launched, which can arrange the page layout more directly and conveniently. There are four buttons at the bottom of the object panel:

Standard View: the view in the default state;

Layout View: Switch to layout view, which is the function to be introduced this time;

press

After pressing the button, the two buttons of the above Layout can be used:

Table layout (LayOut Table): Layout tables on the page like drawing;

Cell layout (LayOut Cell): Draw cells in the table.
Now we try to use the above tools to layout a new page: Create a new page and click

Enter the layout view and click

Draw the table on the page and click

, draw cells in the table, where the table will be represented by a green box, the cells will be represented by blue, and the undetermined cells will be represented by gray, as shown below:

Here, the size of each table and cell can be adjusted at will. Finally, click back to the standard view, and you will find that the "Layout Table" you just drew has been converted into a table. As shown below:

In addition, there is a number on the table in the layout view, which indicates the width of the table. Click the number to see the following menu:

Make Column AutoStretch: Columns automatically stretch, which means that the table can automatically adjust its width according to the screen ratio, which is equivalent to defining the width of the table as a percentage.

Add Spacer image/Remove Spacer Images: Add/remove transparent images. The function of the transparent image is to support the width of the table.

Clear cell Heights: Clear cell height.

The following is how goEway.com uses the Layout function for page layout. Compared with the standard view, it is much more intuitive.