Insert Tables

Next you’ll add a table that will hold text, graphics, and Macromedia Flash assets. Click once on the page to place the insertion point where you want you table to appear.

To Insert a Table:

Design Views in Dreamweaver

The table appears in the document.

Formatting Tables:

When formatting tables in Design view, you can set properties for the entire table or for selected rows, columns, or cells in the table. When a property, such as background color or alignment, is set to one value for the whole table and another value for individual cells, cell formatting takes precedence over row formatting, which in turn takes precedence over table formatting.

The order of precedence for table formatting is:

  1. Cells
  2. Rows
  3. Table

For example, if you set the background color for a single cell to blue, then set the background color of the entire table to yellow, the blue cell does not change to yellow, since cell formatting takes precedence over table formatting.

Merging and Splitting Table Cells:

You can merge any number of adjacent cells--as long as the entire selection is a line or a rectangle of cells--to produce a single cell that spans several columns or rows. You can split a cell into any number of rows or columns, regardless of whether it was previously merged. Dreamweaver automatically restructures the table (adding any necessary colspan or rowspan attributes) to create the specified arrangement.

To merge cells:

In the following illustration, the cells in the middle of the first two rows have been merged into a single cell that spans two rows.

     
   
     

To merge cells, select the cells you want to merge, then select Modify>Table>Merge Cells:

Merge Cells in Dreamweaver

You can also merge cells by clicking the merge cell button Merge Cells in Dreamweaver on the properties inspector.

To split a cell:

Click in the cell. Do one of the following:

Viewing and Setting Table, Cell, Row, and Column Properties:

When a table or cell is selected, the Property inspector lets you view and change its properties. To view and set table or table element properties: Select a table, cell, row, or column (see Selecting table elements). In the Property inspector (Window > Properties), click the expander arrow in the lower-right corner to see all the properties. Change properties as necessary. For more information, see Setting table properties or Setting cell, row, and column properties. NOTE When you set properties on a column, Dreamweaver changes the attributes of the td tag corresponding to each cell in the column. When you set certain properties for a row, however, Dreamweaver changes the attributes of the tr tag rather than changing the attributes of each td tag in the row, When you’re applying the same format to all the cells in a row, applying the format to the tr tag produces cleaner, more concise HTML code.