《网页图像动画设计》上.doc

《《网页图像动画设计》上.doc》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、此文档收集于网络，如有侵权，请联系网站删除网页图像动画设计上此文档仅供学习与交流此文档收集于网络，如有侵权，请联系网站删除第1章网页设计与制作基础1.1DreamweaverMX、FireworksMX和 FlashMX的主要功能和特点1.1.1DreamweaverMX的主要功能和特点1.1.2FireworksMX的主要功能和特点1.1.3FlashMX的主要功能和特点1.2计算机网络基础知识1.2.1HTML文件1.2.2Web空间1.2.3虚拟主机1.2.4IP地址和域名1.2.5统一资源定位器1.2.6服务器

2、与客户机图1-1客户机和服务器此文档仅供学习与交流此文档收集于网络，如有侵权，请联系网站删除1.2.7TCP/IP协议1.2.8文件传输协议1.3图形图像基础知识1.3.1矢量图形和位图图像（a）原图（b）局部放大图1-2将矢量格式的向日葵局部放大的效果（a）原图（b）局部放大图1-3将位图格式的向日葵放大后的效果1.3.2常用图像格式及其特点1.4网页平面设计基础*1.4.1平面构成三要素图1-4自由点图1-5点的连续产生节奏和方向图1-6点的移动轨迹构成了线条图1-7竖线产生的升降感和水平线条产生的静止感图1-8线

3、的移动轨迹构成了面1.4.2网页布局构图1.5网页设计色彩基础1.5.1色彩属性*图1-9色彩明度值由高到低的明度变化过程此文档仅供学习与交流此文档收集于网络，如有侵权，请联系网站删除1.5.2色彩性格*1.5.3色彩心理*图1-10暖色调图案图1-11冷色调图案1.5.4Web安全色图1-12颜色拾取框1.5.5网页色彩调和1.6小结第2章FireworksMX的基础知识2.1FireworksMX的工作环境①本书所有截屏图来自于该软件，未作改动。图2-1FireworksMX的工作环境①2.1.1菜单栏2.1.2工

4、具箱图2-2FireworksMX的【工具】面板此文档仅供学习与交流此文档收集于网络，如有侵权，请联系网站删除2.1.3编辑窗口2.1.4属性面板图2-3【文本】属性面板图2-4【矩形】属性面板2.1.5浮动面板及其功能浮动面板组展开按钮浮动面板组折叠按钮图2-5展开和折叠的浮动面板组2.1.6快速启动栏2.1.7状态栏图2-8状态栏2.1.8标尺、引导线与网格2.2FireworksMX的基本操作2.2.1创建新文档图2-9【新建文档】对话框图2-10自定义画布颜色选择框2.2.2打开文档图2-11【打开】文档对话框

5、此文档仅供学习与交流此文档收集于网络，如有侵权，请联系网站删除2.2.3导入文档图2-12【导入】文档对话框2.2.4保存文档图2-13【另存为】对话框2.2.5导出文档图2-14【导出】文档对话框图2-15【导出预览】对话框2.2.6画布的设置图2-16【画布颜色】对话框图2-17【画布大小】对话框2.2.7修改图像的大小图2-18【图像大小】对话框2.2.8撤销与恢复操作2.2.9使用历史记录面板图2-19【历史记录】面板2.3应用实例①本书例子中所用到的素材及制作的结果均放在与本书配套的《网页设计与制作实验教程》

6、一书的附带光盘中，第××章的素材放在ch××material中，第××章的结果放在ch××result中。后面章节中所述的打开或选择某个文件均是指光盘中从该章material文件夹中打开或选择该文件。目录结构详见本书附录A。图2-20以动画打开方式选择文件图2-21以动画方式打开文件后的【帧】面板图2-22在【导出预览】对话框中选择导出格式为“GIF动画”此文档仅供学习与交流此文档收集于网络，如有侵权，请联系网站删除图2-23在【导出】对话框中设置保存路径和名称图2-24【导入】对话框图2-25导入图像到编辑窗口图

7、2-26调整图像大小2.4小结第3章矢量绘图与文字3.1绘制矢量图形3.1.1绘制直线、矩形和椭圆图3-1【线条工具】默认属性面板图3-2【线条工具】扩展属性面板图3-3【矩形工具】的属性面板3.1.2绘制多边形和星形图3-5【多边形工具】的属性面板之一图3-6【多边形工具】的属性面板之二图3-7【星形工具】的属性面板3.1.3绘制圆角矩形图3-8【圆角矩形工具】的属性面板此文档仅供学习与交流此文档收集于网络，如有侵权，请联系网站删除3.1.4绘制路径3.2编辑路径3.2.1路径的自由变形3.2.2切割路径图3-11用

8、【刀子工具】单击路径切割图3-12用【刀子工具】切割闭合路径3.2.3重绘路径图3-13重绘路径3.2.4组合路径图3-14应用【联合】命令前后的效果对比图3-15应用【相交】命令前后的效果对比图3-16应用【打孔】命令前后效果图3-17应用【裁切】命令前后效果图3-18选择需要合并的两条路径图3-19合并后的路径3.2.5显示和