网页设计与制作第3章.ppt

* 3.1??创建及编辑表格 3.1.1??创建表格 3.1.2??编辑表格 3.2??表格的应用 3.2.1??细线表格效果的制作 3.2.2??格式化表格 3.2.3??分隔线的制作 3.2.4??虚线框表格的制作 3.2.5??导入表格数据 3.2.6??表格排序 第 3 章 表格的应用 3.3??表格应用综合实例 3.3.1??创建表格 3.3.2??插入Flash动画 3.4??习题与上机操作 ◆?创建及编辑表格 ◆?制作各种表格效果 ◆?在网页中插入Flash动画 ◆?能够制作简单的网页 教学进程 本章要点： 3.1 创建及编辑表格 3.1.1 创建表格 教学进程 创建表格的方法 （1）将光标移到要插入表格的位置。 （2）在【插入】工具栏中选择【常用】项，单击【表格】 按钮 ， 或者执行【插入】|【表格】命令。 1 设置表格的参数 ● 【行数】：确定要创建的表格有几行。 ● 【列数】：确定要创建的表格有几列。 ● 【表格宽度】：设置表格的宽度。 ● 【边框粗细】：设置表格边框的宽度。0就表示没有边框。 ● 【单元格边距】：指单元格内容和单元格边框之间的距离，以“像素”为单位。 ● 【单元格间距】：单元格和单元格之间的距离，以“像素”为单位。 ● 【页眉】：可以选择4种页眉模式。 ● 【辅助功能】：可以输入表格的标题、选择标题的对齐模式和输入摘要等信息。 3.1.1 创建表格 2 教学进程 教学进程 3.1.2 编辑表格 选择单元格 选择单个的单元格 连续选择多个单元格 选择多个非连续的单元格 选择整个表格 教学进程 3.1.2 编辑表格 调整列的宽度和行的高度 方法一 将鼠标移动到表格的列边框或行边框上，当出现“双箭头”形状的时候，就可以左右拖动来改变它们的宽度或高度。 可以在属性面板中改变对应的参数 方法二 教学进程 3.1.2 编辑表格 插入行和列 方法一 直接在单元格中右击鼠标，在弹出的快捷菜单中，选择【表格】菜单中的相应命令。 执行【修改】|【表格】|【插入行或列】命令 方法二 单击列或行对应的绿色下三角按钮，在弹出的下拉菜单中选择相应命令。 方法三 教学进程 3.1.2 编辑表格 拆分单元格 方法一 选中要拆分的单元格，用鼠标右键单击它，选择【表格 】子菜单中的【拆分单元格】命令 执行【修改】|【表格】|【拆分单元格】命令 方法二 教学进程 3.1.2 编辑表格 合并单元格 方法一 首先选中要合并的两个单元格，然后用鼠标右键单击它们，在弹出的菜单中选择【表格】子菜单中的【合并单元格】命令 或者执行【修改】|【表格】|【合并单元格】命令 方法二 教学进程 3.1.2 编辑表格 表格的嵌套 含义 所谓表格的嵌套，其实就是在一个单元格中插入一个表格。 只要将光标放置到单元格中，执行【插入】|【表格】命令即可。 方法 教学进程 3.2 表格的应用 3.2.1 细线表格效果的制作 制作步骤 （1）插入2行1列的表格 （2）将表格的背景设置为黑色 （3）选择所有单元格，将背景设置为白色 （4）按F12键，观看效果 教学进程 3.2.2 格式化表格 Dreamweaver 8内置了格式化的表格库。 选中表格，执行【命令】|【格式化表格】命令。 (1) 教学进程 插入一行一列的表格 将高度设置为1，可以设置背景颜色 (2) 切换到【代码视图】 单元格代码为： td height=1 gcolor=#FF0000nbsp;/td (3) 将空格代码“nbsp;”删除 3.2.3 分隔线的制作 方法 教学进程 制作虚线框表格的一种最简单的方法，就是利用表格背景图片来实现。 3.2.4 虚线框表格的制作 效果 导入表格式数据 可以将一些具有制表符、逗号、分号、引号或者其它分隔符格式化好了的表格导入到网页文档中。 教学进程 3.2.5 导入表格数据 对于需要在网页中放置大量格式化数据的情况提供了更加快捷、方便的方法。 教学进程 执行【命令】|【排序表格】命令 3.2.6 表格排序 教学进程 3.3 表格应用综合实例 3.3.1 创建表格 插入一个4行2列，宽750像素，高200像素的表格 1 合并部分单元格 2 表格居中，背景为白色 3 *