网页制作技术第13章.pptVIP

第 13 章 美 化 网 页 13.1 利用Fireworks MX美化网页 13.2 利用Flash MX制作网页动画 设计并制作出赏心悦目的网页并非容易的事情，单独使用Dreamweaver MX来设计是得不到满意效果的，还需要利用网页三剑客的另两位成员：Fireworks MX和Flash MX来对Dreamweaver MX设计的网页作进一步的美化工作。 13.1 利用Fireworks MX美化网页 Fireworks MX最主要的功能就是进行网页图像的制作和处理，如制作交互图像、图像映像等。 13.1.1 Fireworks MX的基本操作 1．认识Fireworks MX的操作界面 （1）启动Fireworks MX （2）Fireworks MX窗口组成 2．Fireworks MX的常用菜单及工具 （1）画面显示与调整 （2）对象选择方法 13.1.2 利用Fireworks MX制作网页按钮 1．制作网页导航条 导航条实际上是一组互斥按钮，亦称导航按钮。制作的方法比较简单，只要创建一个按钮，对其进行必要的修饰完善操作，再将其进行复制得到多个按钮，最后分别修改其文字提示及链接即可。 2．制作网页个性化按钮 由于Fireworks MX中提供的按钮样式毕竟有限，现在我们不使用现成按钮样式库中的按钮，而是自己动手绘制一组按钮，并进行一些修饰与设置。 13.2 利用Flash MX制作网页动画 Flash自从问世以来，就在网页动画制作领域掀起了一股热潮，“闪客”一族也应运而生。作为一个网页动画的标准专业制作工具，Flash MX可以用来创建网站动画徽标、网站导航条、长篇Flash动画，甚至完整的Flash站点。 13.2.1 Flash动画概述 与传统动画类似，Flash动画也是由一系列连续的帧组成的，当以一定速率播放这些帧时，由于人眼的视觉暂留，看到的便是连续的动画。这种动画被称为“逐帧动画”。要创建逐帧动画，需要将每个帧都定义为“关键帧”，然后给每个帧创建不同的图像。 除了逐帧动画之外，Flash MX还可以创建“补间动画”，也就是常说的“渐变动画”。 1．Flash MX简介 Flash MX是美国Macromedia公司出品的矢量图形编辑和动画创作专业软件，被广泛应用于网页设计和多媒体创作等领域。 2．有关动画的一些基本概念 （1）帧（Frame） ① 关键帧 ② 静止帧 ③ 中间过渡帧 （2）层（Layer） （3）场景（Scene） （4）影片（Film） 3．认识Flash MX界面 （1）启动Flash MX （2）Flash MX窗口的组成 4．Flash MX中的一些基本操作 （1）帧的操作 动画是由时间线上一格一格的帧所组成的，时间线面板的标尺上有一个帧指针，它标示出当前帧所在的位置，在时间线面板的下边也会同时显示出帧的序号。 （2）层的操作 Flash作品可以由多个层共同组成，层与层之间既相互独立，又相互影响。每个层上都有各自独立的图形或动画，将这些包含内容的层按一定的顺序重叠在一起，即形成了由它们共同产生的综合的效果。在播放时，画面上呈现的就是这种综合的效果。 （3）场景的操作 ① 新增场景 ② 当前场景的切换 ③ 场景的更名 ④ 删除场景 13.2.2 利用Flash MX制作网页动画 1．Flash动画的类型 Flash动画分为两种类型： 逐帧动画 （frame-by-frame animation） 过渡动画 （tweend animation） 2．Flash动画的制作 （1）创建过渡动画 （2）创建逐帧动画 3．在网页中加入Flash动画 如果要把Flash动画加载到网页上，作为网页元素供浏览者欣赏，首先要将其输出为动画播放格式的文件（*.swf），然后在需要插入动画的位置直接插入Flash动画，或编制一段HTML引导程序，用以调用Flash动画播放插件，并播放指定位置的Flash动画播放文件。 另外，Flash MX还能够根据用户的不同需求，同时输出多种与该Flash动画有关的格式文件，如GIF或者是JPEG动画序列文件等。 （1）前期工作 网页中所插入的Flash动画是.swf格式，而不是默认的.fla格式，因此需要生成.swf格式的文件 。 （2）文件的发布设置 执行主菜单中的“文件”→“发布设置”命令，打开“发布设置”对话框，如图13-43所示。 （3）在Dreamweaver MX制作的网页中插入.swf文件 （4）在网页中插入.swf文件所对应的HTML引导程序（或代码） * 图13-1 Fireworks MX窗口 图13-25 Flash M