Adobe Dreamweaver CC 2014 v.13 - Manual (Page 248)

Presenting content with tables
To the top
To the top
To the top
About tables
Table formatting precedence in HTML
About splitting and merging table cells
Insert a table and add content
Import and export tabular data
Select table elements
Set table properties
Set cell, row, or column properties
Use Expanded Tables mode for easier table editing
Format tables and cells
Resizing tables, columns, and rows
Resize tables, columns, and rows
Add and remove rows and columns
Split and merge cells
Copy, paste, and delete cells
Nest tables
Sort tables
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 .
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.
Table formatting precedence in HTML
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 as follows:
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.
Note: When you set properties on a column, Dreamweaver changes the attributes of the td tag corresponding to each cell in the column.
About splitting and merging 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
241