文档介绍：第四章网页元素定位
本章要点
标准表格
建立表格
布局表格
绘制布局表格与布局单元格
编辑布局表格与布局单元格
层
层的特点
层的基本操作
层面板
设置层属性
框架
框架基础
框架的基本操作
框架与框架集属性
标准表格
在信息世界中表格主要用于装载数据信息。由于表格能将单元格中的内容规划整齐后显示出来,表格属性能改变对象在浏览器中的显示效果,所以表格就成为网页中组织规划文字、图像等内容的排版工具。
本节主要介绍表格的建立、对表格的一些基本操作和怎样利用表格来构造页面的整体框架。
建立表格
<table属性名="属性值" …>
<caption属性名="属性值" …>表格标题</caption>
<tr属性名="属性值" …>
<th属性名="属性值" …>表头1</th>
<td属性名="属性值" …>表项1</td>
</tr>
<tr属性名="属性值" …>
<th属性名="属性值" …>表头2</th>
<td属性名="属性值" …>表项2</td>
</tr>
</table>
建立表格
表格标签<table>的常用属性有width、height、border、align、cellpadding(表项内部空白)、cellspacing(表项间隙)、bordercolor、 background、bgcolor、frame
标题标签<caption>的常用属性有align、 valign(标题在表格的上部或下部,值为bottom|top)。
行标签<tr>、单元格标签<td>、表头标签<th>的常用属性有width、height、align、valign、nowrap、bordercolor、background、bgcolor。此外还有跨多行属性colspan和跨多列属性rowspan,如:
< th colspan=x rowspan=y > 表项< /th >
建立表格
<body>
<table width="247" height="129" border="1">
<caption>学生成绩表</caption>
<tr>
<th rowspan="2">学号</th>
<th rowspan="2">姓名</th>
<th colspan="3">成绩</th>
</tr>
<tr><th width="40">数学</th><th width="40">语文</th><th width="40">外语</th></tr>
<tr><td>040321</td><td>张三</td><td>78</td><td>88</td><td>90</td></tr>
<tr><td>050833</td><td>李四</td><td>67</td><td>75</td><td>98</td></tr>
<tr><td>067712</td><td>王五</td><td>90</td><td>56</td><td>70</td></tr>
</table>
</body>
建立表格
使用Dreamweaver建立表格,通过“插入”面板或者“插入”菜单
编辑表格
选择整个表格:单击表格左上角或右边框或底边框或状态条中的<Table>标签。
选择一行或一列单元格:将鼠标指针置于一行的左边框上,或置于一列的顶端边框上,当选定箭头出现时单击。
选择连续的几个单元格:在一个单元格中单击并拖动鼠标横向或纵向移至另一单元格。
选择不连续的几个单元格:按住Ctrl键,单击欲选定的单元格、行或列。
选择单元格中的网页元素:点击单元格中的网页元素。
编辑表格
表格属性面板
行、列、一个或多个单元格的属性面板
【例4-2】表格嵌套和代码
在对表格多次设置同一属性时,单元格的属性优先于表格行的属性,表格行的属性优先于整个表格的属性。
【例4-3】利用表格构造网页的整体框架