模块利用apdiv布局网页.pptx

1 模块利用APDiv布局网页 布置习题 知识讲解 课堂实践 教学总结 课程引导 利用AP Div布局网页 学习情境6 学习目标 掌握利用AP Div布局对象有效控制页面对象和利用时间轴制作动画的方法 学习目标 第1页/共27页 布置习题 知识讲解 课堂实践 教学总结 课程引导 利用AP Div布局网页 学习情境6 学习目标 使用Dreamweaver CS3中AP Div容器和时间轴基本操作的能力 利用Dreamweaver CS3中AP Div容器和时间轴控制网页中对象的能力 专 业 能 力 目 标 第2页/共27页 布置习题 知识讲解 课堂实践 教学总结 课程引导 利用AP Div布局网页 学习情境6 学习目标 创建普通AP Div、选择AP Div、AP Div的属性设置 移动AP Div、改变AP Div的大小、对齐AP Div、AP 元素面板的使用、时间轴、创建时间轴动画 使用Spry菜单栏、使用Spry选项卡式面板、使用Spry折叠式、使用Spry可折叠面板 专 业 知 识 目 标 第3页/共27页 布置习题 知识讲解 课堂实践 教学总结 课程引导 利用AP Div布局网页 学习情境6 学习目标 自主学习能力 获取知识能力 创新能力 知识应用能力 结构布局能力 专 业 素 质 目 标 第4页/共27页 课堂实践 布置习题 学习目标 教学总结 课程引导 利用AP Div布局网页 学习情境6 知识讲解 教学案例 案例01 – 利用AP Div布局网页版面 案例02 – 使用AP Div和时间轴制作动画 案例03 – 在网页添加下拉菜单效果 综合案例实训 - 制作“某网络技术服务公司”首页页面 第5页/共27页 课堂实践 布置习题 学习目标 教学总结 课程引导 利用AP Div布局网页 学习情境6 知识讲解 案例操作过程 相关知识点 案例01 – 利用AP Div布局网页版面 第6页/共27页 课堂实践 布置习题 学习目标 教学总结 课程引导 利用AP Div布局网页 学习情境6 知识讲解 相关知识点 “插入记录布局对象AP Div “布局”插入栏”绘制AP Div” 绘制多个AP Div 创建普通AP Div 第7页/共27页 课堂实践 布置习题 学习目标 教学总结 课程引导 利用AP Div布局网页 学习情境6 知识讲解 相关知识点 标签选择器选择 面板选择 快捷键选择 选择多个AP Div 选择AP Div 第8页/共27页 课堂实践 布置习题 学习目标 教学总结 课程引导 利用AP Div布局网页 学习情境6 知识讲解 相关知识点 标记与属性 第9页/共27页 课堂实践 布置习题 学习目标 教学总结 课程引导 利用AP Div布局网页 学习情境6 知识讲解 案例02 – 使用AP Div和时间轴制作动画 案例操作过程 相关知识点 第10页/共27页 课堂实践 布置习题 学习目标 教学总结 课程引导 利用AP Div布局网页 学习情境6 知识讲解 相关知识点 鼠标拖动 每次移动1个像素(方向键) 每次移动10个像素(Shift键+方向键) 移动AP Div 第11页/共27页 课堂实践 布置习题 学习目标 教学总结 课程引导 利用AP Div布局网页 学习情境6 知识讲解 相关知识点 拖动边框 拖动对角线 “属性”面板中修改宽度和高度值 改变AP Div的大小 第12页/共27页 课堂实践 布置习题 学习目标 教学总结 课程引导 利用AP Div布局网页 学习情境6 知识讲解 相关知识点 “修改排列顺序” 对齐AP Div 注意：对齐时是以最后一个选定的AP Div的边框来进行的 第13页/共27页 课堂实践 布置习题 学习目标 教学总结 课程引导 利用AP Div布局网页 学习情境6 知识讲解 相关知识点 AP元素面板的使用 第14页/共27页 课堂实践 布置习题 学习目标 教学总结 课程引导 利用AP Div布局网页 学习情境6 知识讲解 相关知识点 “时间轴”面板用于显示AP Div与图像随时间变化的属性。选择“窗口时间轴”命令即可打开“时间轴”面板 时间轴 第15页/共27页 课堂实践 布置习题 学习目标 教学总结 课程引导 利用AP Div布局网页 学习情境6 知识讲解 相关知识点 帧——是进行动画制作的最基本的单位，每一个精彩的动画都是由很多个精心雕琢的帧构成的，在时间轴上的每一帧都可以包含需要显示的所有内容，包括图形、声音、各种素材和其他多种对象 关键帧——顾名思义，有关键内容的帧。用来定义动画变化、更改状态的帧，即编辑舞台上存在实例对象并可对其进行编辑的帧 创建时间轴动画 第16页/共27页 课堂实践 布置习题 学习目标 教学总结 课程引导 利用AP Div布局网页 学习情境6 知识讲解 案例03