网页设计与制作Dreamweaver CS6标准教-ppt课件-06

在对表格的操作过程中，如需设置行、列或者是某 几个单元格的属性，可选中一个或多个单元格，打 开单元格【属性】面板进行设置。



根据需要可以在表格的某些单元格中插入文本、图 像或各种多媒体对象。在表格中插入内容通常采用 两种方法。 （1）直接在【文档】窗口中插入。 （2）利用剪贴板插入。





1.利用菜单 2.利用快捷键 3.利用鼠标直接拖动



1.删除整个表格 2.删除整行或整列 3.清除表格中的内容


1.利用表格【属性】面板 2.利用【修改】菜单



通过更多次的拆分合并，以及更多的表格嵌套，形 成更加复杂的表格布局形式。 由于浏览器下载网页是采取逐层下载的形式，如果 将整个复杂网页放在一个大<table>中进行布局， 会极大地影响网页的下载速度。 如果表格超过了3层，搜索引擎就不再抓取。 应尽量将一个大的表格，拆分成多个小的表格，由 上至下排列，以最大地提高网页的浏览和检索效率。



6.2.1课堂案例-融通室内装饰 6.2.2复制、粘贴表格 6.2.3删除表格和清除表格内容 6.2.4增加和删除表格的行和列



案例学习目标：学会表格基本操作，体验简单 排版过程。 案例知识要点：选择菜单【修改】|【表格】， 打开子菜单，选择相应菜单项，对表格进行编 辑，实现简单表格的排版。在表格【属性】面 板和单元格【属性】面板中设置其基本属性， 对整个页面进行外观设计。 素材所在位置：光盘/素材/ch06/课堂案例融通室内装饰。 案例布局如图6-11所示，案例效果如图6-12 所示。

1．选择单元格 2．选择行/列 3．选择整个表格


在绘制不规则表格过程中，经常要将多个单元格合 并成一个单元格，或者将一个单元格拆分成多行或 多列。 在采用简单表格布局的网页中，根据网页布局情况 合并和拆分单元格是网页布局的关键工作。 1. 单元格的合并 2. 单元格的拆分




简单表格排版就是在页面中插入一个边框宽 度为0的表格，通过对行、列和单元格的设 置和调整，实现网页元素的精确定位，完成 页面排版。 用于行列比较规整，结构比较简单的网页。


1. 嵌套表格的大小 2. 嵌套表格的位置



在Dreamweaver中，单元格【属性】面板中仅提 供了单元格的背景颜色设置方法，设置表格的背景， 或是设置单元格的背景图片，通常采用以下两种方 法。 1.直接修改代码 2.通过添加CSS样式


在很多网页制作风格中，设置表格内框线的细线效 果，可以强化表格的装饰性而使表格更加美观。但 是，细线表格的设置方式不是简单地将表格边框宽 度设置为1px，因为此时表格边框宽度和形状都不 是细线效果。 创建细线表格的方法是，当单元格间距为1px时， 分别对表格和单元格设置不同背景颜色，内框线的 细线效果即可显示出来。

在实际制作网页过程中，有时需要将其他程序中建 立的表格数据导入到网页中，利用【导入表格式数 据】命令可以很容易地实现这一功能。



6.4.1课堂案例-远景苑小区 6.4.2导入Word或Excel数据 6.4.3排序




案例学习目标：学习使用表格表示数据。 案例知识要点：使用菜单【插入】|【表格对象】| 【导入表格式数据】，在页面指定位置插导入表格 式数据。 素材所在位置：光盘/素材/ch06/课堂案例-远景 苑小区。 案例效果图如图6-60所示。
网页设计与制作 Dreamweaver CS6 标准教程



Hale Waihona Puke 1.表格的基本操作 2.简单表格的排版 3.复杂表格的排版 4.表格的数据功能

在一个表格中，横向称为行，纵向称为列，行列交 叉部分称为单元格，单元格中的内容和边框之间的 距离称为边距，单元格和单元格之间的距离称为间 距，整张表格的边缘称做边框。


1. 将Word文档中数据导入到网页表格中 2. 将Excel文档中数据导入到网页表格中

Dreamweaver还具.有为表格中数据排序的功能


6.5.1练习案例-爱丽丝家具 6.5.2练习案例-鲜花速递网



案例练习目标：练习简单网页排版。 案例操作要点： 1．创建名称为index.html的网页文档并存于站点根 文件夹中。 2．设置页面属性：字体大小12px，颜色白色，加粗， 背景颜色为#897715。 3．采用简单表格进行布局。插入6行2的布局表格， 表格宽度为900px，单元格间距为5px，并根据案例 布局图进行单元格合并。

选择菜单【插入】|【表格】，或选择【插入】面板 中的【布局】选项卡，单击【表格】按钮 ，也可使 用<Ctrl+Alt+T>组合键，打开【表格】对话框， 设置表格相关属性后，单击【确定】按钮，即可在 网页中光标所在位置上插入表格。

在页面中新建表格或选中表格，打开表格【属性】 面板，在表格的【属性】面板中，可以设置表格属 性，用来控制表格的外观特征。



6.3.1课堂案例-江雨桥的博客 6.3.2表格的嵌套 6.3.3单元格与表格背景 6.3.4细线表格



案例学习目标：学习复杂表格排版。 案例知识要点：在页面中插入多个表格。在主表 格中，通过嵌套表格和进一步拆分单元格，实现 复杂表格的排版。在表格【属性】面板和单元格 【属性】面板中设置其基本属性，对整个页面进 行外观设计。 素材所在位置：光盘/素材/ch06/课堂案例-江雨 桥的博客。 案例效果图如图6-35所示，案例布局如图6-36 所示。



6.1.1表格的组成 6.1.2插入表格 6.1.3表格属性 6.1.4表格单元格属性 6.1.5在表格中插入内容 6.1.6选择表格元素 6.1.7合并和拆分单元格


一个完整的表格是由多个HTML表格标签组合而成 的。 <table>和</table>分别是表格的起始标签和终 止标签，所有有关表格的内容均位于这两个标签之 间。<tr>和</tr>是表格的行标签，出现几对 <tr>和</tr>，表格就包含几行。<td>和</td> 是表格的列标签，位于<tr>和</tr>标签之间，出 现几对<td>和</td>，该行就包含几列。