网站建设与网页制作实训指导书讲解.docVIP

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