adobe dreamweaver cs5 on demand part 31 potx

ptg
192 Chapter 8
After you finishing creating the table layout and cells, you can insert
content. You can add text, images, and other data in Standard or
Expanded Table modes. Simply click in the cell where you want to add
material, and then type, paste, or insert the content you want. If you
have content available in the Assets or Files panel, you can drag it into
the table; releasing your mouse when you're hovering over the right
cell. You can only add content to layout cells; the empty grey area in a
layout table is not available for content. When you add content to a
cell, it automatically expands to accommodate the incoming content,
which changes the size of the column and table.
Adding Content into
a Table
Add Text or an Image to a Table
Open the Web page that contains
the table you want to add content.
Click to place the insertion point in
the layout cell where you want to
add content.
To ad d text, type or paste the text
you want.
◆ Press Enter (Win) or Return
(Mac) to add a paragraph
return.
◆ Press Shift+Enter (Win) or
Shift+Return (Mac) to add a
soft return.
NOTE
By default, the text is left
justified and centered within the

cell, and soft wraps at the end of
the table cell.
To ad d an image, click the Insert
menu, click Image, select the
image file you want, and then
click OK.
The table expands to
accommodate the text or image
content.
4
3
2
1
1
4
2
3
See Also
See “Importing Tabular Data” on page
93 for information on importing data
and creating a layout table.
From the Library of Wow! eBook
ptg
Chapter 8 Working with Web Page Tables 193
Modify Table Text
Select the table text you want to
modify.
In the Properties panel, modify the
text using the following options:
◆ Format. Click to change the

basic HTML format of the text
(heading and paragraph styles).
◆ Style. Click to work with CSS
style sheets.
◆ Alignment. Click to change the
justification of the text (Align
Left, Align Center, Align Right,
or Justify).
◆ Bold/Italic. Click to bold or
italicize
the selected text.
◆ Font. Click to change the
default font of the selected
table text.
◆ Size. Click to change the
default size of the selected
table text.
◆ Color. Click to change the color
of the selected table text
(black, default).
2
1
1
2
Did You Know?
You can sort rows in a table.
If you
don’t have any merged cells in a table,
you can sort the table. Select the table
or click in any cell, click the

Commands menu, and then click Sort
Table. In the Sort dialog box, set the
options you want, and then click OK.
Some of the sort options include Sort
By, Order, Sort Includes The First Row,
Sort Header Rows, Sort Footer Rows,
and Keep All Row Colors The Same
After The Sort Has Been Completed.
From the Library of Wow! eBook
ptg
194 Chapter 8
Instead of retyping data in a table that you have in another document,
such as Microsoft Excel, you can import it into a table in Dreamweaver.
The tabular data needs to be saved in a delimited text format with items
separated by tabs, commas, colons, or semicolons. If you want to use
data from a table in Dreamweaver in another document, you can export
table data into a text file. When you export a table, the entire table is
exported. You cannot export parts of a table. However, you can copy
parts of a table and paste it into another document.
Importing and
Exporting Table Data
Export Table Data
Open the Web page with the table
you want to format.
Click to place the insertion point in
any cell of the table.
Click the File menu, point to
Export, and then click Table.
Specify the following options:
◆ Delimiter. Specifies the

character you want to separate
items in the exported file.
◆ Line Breaks. Specifies the
operating system in which you
want to open the exported file.
Different operating systems use
different ways of indicating the
end of a line break.
Click Export.
Navigate to the location where
you want to save the file.
Enter a name for the file.
Click Save.
8
7
6
5
4
3
2
1
4
5
7
8
6
From the Library of Wow! eBook
ptg
Imported data into a table
Chapter 8 Working with Web Page Tables 195

Import Tabular Data into a Table
Open the Web page with the table
you want to use.
Click to place the insertion point in
any cell of the table.
If you click in an existing table,
you’ll create a nested table.
Click the File menu, point to
Import, and then click Tabular
Data.
Specify the following options:
◆ Data File. Enter the name of the
file, or click Browse to select it.
◆ Delimiter. Specify the
character used to separate
items in the imported file.
Select Other to enter a
delimiter character.
◆ Table Width. Specifies the
width of the table. Select Fit to
Data to make each column
wide enough to fit the data.
Select Set to specify an exact
width.
◆ Cell Padding. Specifies the
number of pixels between a
cell's content and the cell
boundaries.
◆ Cell Spacing. Specifies the
number of pixels between

adjacent table cells.
◆ Format Top Row. Specifies the
formatting applied to the top
row.
◆ Border. Specifies the width in
pixels of the table’s border.
Click OK.
Dreamweaver creates a new table
with the tabular data from the
imported file.
5
4
3
2
1
4
5
From the Library of Wow! eBook
ptg
196 Chapter 8
As you begin to work on a table, you might need to modify its structure
by adding more rows and columns to accommodate new text, graphics,
or other tables. The table realigns as needed to accommodate the new
structure. When you insert rows or columns, the existing rows shift
down, the existing columns shift right, and you choose what direction
the existing cells shift. Similarly, when you delete unneeded rows,
columns, or cells from a table, the table realigns itself.
Adding Columns or
Rows to Tables
Add a Column or Row to

a Table
Open the Web page with the table
you want to modify.
Click to place the insertion point
where you want to add a row or
column.
To ad d a row or column, click the
Insert menu, point to Table
Objects, and then click Insert
Columns to The Left, Insert
Column to The Right, Insert Row
Above, or Insert Row Below.
TIMESAVER
Use buttons on
the Layout tab on the Insert panel
or the column header menu (arrow
above a column) for columns.
To ad d multiple rows or columns,
click the Modify menu, point to
Table, click Insert Rows Or
Columns, enter the number of
columns or rows you want to add
to the table, and the related
options, and then click OK.
4
3
2
1
3
4

Did You Know?
You can delete rows and columns in a
table.
Select the rows or columns you
want to delete, click the Modify menu,
point to Table, and then click Delete
Row or Delete Column.
Enter number of columns or rows
From the Library of Wow! eBook
ptg
Chapter 8 Working with Web Page Tables 197
Resizing Columns and
Rows
Modify Column Widths and Row
Heights
Open the Web page with the table
you want to modify.
To ch ange a columns width, use
any of the following:
◆ Change Column Width and
Keep Table Width. Drag the
right border of the column to
change it.
◆ Change Column Width and
Keep Other Column Widths.
Shift-drag the column border.
◆ Clear Column Width. Click the
Column Header Arrow, and
then click Clear Column Width.
To ch ange a row height, drag the

lower border of the row.
Click the Table Header Arrow, and
then select any of the following
options:
◆ Clear All Heights or Clear All
Widths. Removes the excess
empty space in a cell.
◆ Make All Widths Consistent.
Makes all the column widths
the same.
◆ Hide Table Widths. Hides the
table widths at the top of the
table.
4
3
2
1
After you create a table, you can resize the columns and rows to fit
your space and data needs. You can set a column to a variable, fixed or
consistent width. If you see two numbers for a column’s width, then the
column width set in the HTML code doesn’t match the columns width
on the screen. You can make the width specified in the code match the
visual width. After you insert content into the cell, you can clear the
excess width and height of the cell.
2 31 4
From the Library of Wow! eBook