网站建设与网页制作实训指导书
计算机网络技术专业适用
孙铀编写
大连职业技术学院
信息技术系
计算机网络技术教研室
目录
实训一 利用Dreamweaver的表格功能布局网页 ......... 2 实训二 CSS样式表（4学时） ....................... 3 实训三 实训四 实训五 实训六 实训七 实训八 实训九 实训十 实训十一
利用Dreamweaver的行为功能制作动画 ......... 4 利用Dreamweaver的站点功能设置站点并上 ..... 6 安装设置PWS调试个人站点 (2学时) .......... 7 利用ODBC连接ACCESS数据库并设置数据源名 ... 8 以留言簿为例调试（4学时） ................. 9 使用Flash的编辑工具及辅助工具（2学时） ... 10 用flash实现基本动画、多层动画制作 ......... 11 使用flash测试作品 (2学时) ................ 13 制作“漫天飞雪”动画 （3学时） ............ 14 1 / 16
实训一 利用Dreamweaver的表格功能布局网页
（4学时）
一、实训条件
（机房/Dreamweaver）
二、实训目的
掌握表格在网页布局中的特点及应用；掌握如何通过表格来布局一个完整的界面。
三、实训内容
通过表格构建完整的页面
四、实训步骤
1． 创建网页的“头部分”。
1) 插入一个1行2列，宽为760象素，边框及边距均为0的表格。 2) 插入一个1行1列，宽为760象素，边框及边距均为0的表格。 3) 插入一个1行2列，宽为760象素，边框及边距均为0的表格。 4) 分别进行简单设置。 2． 创建网页的“主体部分”。
1) 插入一个1行3列，宽为760象素，边框及边距均为0的表格，这个表格将放置页面的主体内容。
2) 在左边单元格中插入一个12行1列，宽为90%的表格。（表格的嵌套）
3) 在中间单元格插入一个4行1列，宽为95%的表格。 4) 在右边单元格插入一个7行1列，宽为90%的表格。 5) 分别进行简单设置。 3． 创建网页的“尾部分”。
1) 插入一个2行2列，宽为760象素，边框及边距均为0的表格。 2) 进行简单设置。
五、实训考核方法
过程考核：根据例子，通过学生对本例做的效果
如：是否严格按照要求；是否达到布局美观的效果。 以及举一反三，融会贯通等给出成绩。
2 / 16
实训二 CSS样式表（4学时）
一、实训条件
（机房/Dreamweaver）
二、实训目的
掌握在Dreamweaver MX中定义CSS的方法和技巧。使你的网页真正“美”起来。
三、实训内容
1. 区块 2. 盒子 3. 边框 4. 列表
四、实训步骤
1. 区块
样式一：设置“字母间距”为1象素。
设置“文字缩进”为2字体高。
样式二：设置“文本对齐”为“两端对齐”。
2. 盒子
样式一：设置“填充”“上”为6象素，“全部相同”。应用到表格。 样式二：设置“浮动”为“右对齐”、“填充”为6象素。应用到图片。 3. 边框 样式一：设置“样式”为“实线”，“宽度”为1象素，“颜色”为#666666。 样式二：设置“样式”为“凸出”，“宽度”为“粗”，“颜色”分别为#339900，#336600，#333300，#339900。 样式三：设置“下”为“双线”，其他设置为“无”，“宽度”为1象素，“颜色”为#ff6600. 4. 列表
样式一：设置“类型”为“圆圈”，“位置”为“内”。 样式二：设置“类型”为“方块”，“位置”为“外”。
样式三：设置“类型”为空，然后点击“项目符号图像”一栏后面的“浏览”按钮，选择素材中本例对应的images目录下的图片list.gif。“位置”一栏设置为“外”。
五、实训考核方法
过程考核：根据例子，通过学生对本例做的效果
如：是否严格按照要求；是否达到熟练应用CSS等。 以及举一反三，融会贯通等给出成绩。
3 / 16
实训三 利用Dreamweaver的行为功能制作动画
（4学时）
一、实训条件
（有音箱机房/Dreamweaver）
二、实训目的
掌握在Dreamweaver MX中定义行为的方法和技巧。使你的网页真正“动”起来。
三、实训内容
1. 变色按钮的制作。
2. 如何在页面中播放声音。 3. 控制时间轴播放。 4. 层拖拽效果。
四、实训步骤
1. 变色按钮的制作。
1) 插入一个4行1列的表格，宽为150象素，边框为1象素。 2) 在单元格中输入文本，设置链接。 3) 修改源代码，命名标签DIV。 4) 设置行为属性。 2．如何在网页中播放声音。
1) 选中
选项，在行为菜单中选择“播放声音”。 2) 选择素材声音文件，设置触发条件onload. 3) 设置播放属性。 3．控制时间轴播放。1) 在网页中插入一层，将图片放到层中。
2) 设置“层”的“溢出”属性为hidden，将层拖放到时间轴面板中。
3) 设置时间轴Timeline1。
4) 复制时间轴Timeline1，设置时间轴Timeline2。
5) 在页面中再插入两层，在层中插入文本，用来通过行为控制时间轴的播放。 6) 设置行为。 4．层拖拽效果。
1) 在网页中插入四个层，然后在层中插入对应的“购物车”图片。 2) 分别选中“物品”图片，进行行为属性的设置。
五、实训考核方法
过程考核：根据例子，通过学生对本例做的效果
4 / 16
网站建设与网页制作实训指导书讲解
