31、Dreamweaver网页设计实用指南：表格、元素与表单操作全解析

Dreamweaver网页设计实用指南：表格、元素与表单操作全解析

1. 表格操作基础

在网页设计中，表格曾经是实现精确布局的关键工具。不过近年来，随着 <div> 元素的出现，表格更多地回归到其原本展示表格数据的用途。

1.1 添加表格

要在文档中添加表格，可以通过以下两种方式：
- 选择“Insert➪Table”。
- 点击“Common Insert”面板上的“Table”按钮。

之后会弹出“Table”对话框，需要填写以下选项：
|选项|说明|
| ---- | ---- |
|Rows and Columns|输入表格的基本行数和列数|
|Table Width|指定表格的总宽度，可以是固定像素值，也可以是浏览器总宽度的百分比|
|Border Thickness|设置表格边框的像素大小，若选择 0，则不显示边框；若未输入值，大多数浏览器默认值为 1|
|Cell Padding and Cell Spacing|分别输入单元格内边距和单元格间距的像素值。内边距是单元格边缘与内容之间的空间，间距是单元格之间的空间。若未指定值，浏览器通常显示内边距为 1，间距为 2|
|Header|若要添加表头，可选择表头样式（左、上或两者都有），这对使用屏幕阅读器的视障人士特别有帮助|
|Caption|若需要在表格旁边显示标题，可输入相应文本|
|Summary|在“Summary”框中输入文本，用于总结表格内容，这一功能常被屏幕阅读器使用|

填写完毕后，点击“OK”，表格就会插入到文档