html+css网页设计指南 7课件.pptVIP

第15章 了解页面制作工具 制作页面最基本的工具是记事本，如果设计者愿意，完全可以用记事本做出任何页面。事实上，很多人也是这样做的。但为了提高设计者的工作效率，出现了很多页面编辑软件，最闻名遐迩、运用也最广泛的是Adobe公司的系列产品，本章将介绍这些主流的网页编辑工具。 本章的主要知识点有： 使用Dreamweaver工具实现页面开发。 了解Photoshop。 了解Flash视频文件。 了解Flash工具和它的一些使用。 15.1 可视化编辑页面工具：Dreamweaver Dreamweaver是美国MACROMEDIA公司开发的、集网页制作和管理网站于一体的、所见即所得的网页编辑器。强大全面的功能使之受到许多人的喜爱，利用它可以提高制作页面的效率。 在早期的Dreamweaver版本中，虽已开始基于CSS样式表进行页面布局，但设计思路并不像今天一样，能从“HTML制作框架，CSS样式表进行修饰，JavaScript发挥页面的动态效果”这个角度出发，而是仍从老用户习惯的表格框架布局页面的角度来考虑问题。 但新版本Dreamweaver CS3.0中，则有了很大改变。最明显的就是，页面设计方式变为以“DIV+CSS”的思路为出发点。这无疑将使得设计者更易操作。 15.1.1 了解Dreamweaver的界面 当用户第一次打开Dreamweaver时，会要求用户“创建一个新页面”。并会给出多种不同的选项，如PHP、HTML、XML等。对于初学者来说，可以从选择HTML开始。 Dreamweaver的主界面如图15.1所示。 15.1.2 Dreamweaver的菜单 和其他软件一样，Dreamweaver界面的顶部是菜单栏，主要的菜单项有： File（文件）：可以进行打开、新建、保存这些基本操作，同时也有一些导入、导出其他素材等功能。 Edit（编辑）：可以进行复制、删除、粘贴等对页面的操作。 View（查看）：可以对页面的显示方式进行编辑。如使用尺寸、网格线等来编辑页面布局。 Insert（插入）：可以在页面中插入图像、表格、超链接和表单等页面文件。 Modify（修改）：可以针对页面中不同的对象进行修改，如修改表格的行列属性、CSS样式表的属性等。 Text（文本）：可以对文本进行专门的编辑，如修改文本的字体大小、字体样式等。 Command（命令）：可以预先设置好一组命令，当需要对不同对象使用相同操作时，就不用重复编辑了。 Site（站点）：用来链接整理服务器。 Windows（视窗）：控制在界面中打开不同的窗口。 Help（帮助）：可以连接互联网查找一些关于Dreamweaver的使用资料。 15.2 神奇的美工笔——Photoshop 对于前端页面开发者来说，在熟练掌握了页面布局技巧之后，接下来就要加强自己的图像编辑能力。在诸多图像编辑软件中，Photoshop应用的最广泛。 设计者一般会在Photoshop中做好页面的设计图，然后放到Dreamweaver中进行编辑。本节将介绍如何使用Photoshop的各项功能。 15.2.1 了解Photoshop的界面 Photoshop 和 Dreamweaver同属于Adobe公司。所以，它们的界面非常相似。Photoshop的主界面如图15.3所示。 15.2.2 Photoshop的使用技巧 在Photoshop中，通过工具栏能完成大部分操作。工具栏位于整个界面的左侧，详细选项如图15.4所示。 15.3 网页中的动画——Flash Flash软件也是同属于Adobe公司的一款软件，其作用就是用来制作 Flash 动画文件。 Flash软件不仅能制作具备简单动画效果的Flash动画，也可以制作具有精美动态效果的页面。 15.3.1 认识Flash文件 Flash是目前最为流行的一种矢量动画格式文件，最初主要用于制作比Gif更漂亮的动画。由于其使用了向量运算﹙Vector Graphics﹚的方式，因此产生出来的影片体积非常小。 发展至今，Flash的功能已不仅仅局限于制作简单的页面动画。Flash技术结合 ActionScript 语言对象和流程控制技术，已经完全可以做出具备互动功能的前端页面。甚至，使用Flash还能制作简单的游戏。 要制作Flash动画，就必须通过Flash的源文件。Flash源文件的后缀名是.fla，在Flash软件中可以编辑这种格式的文件。但由于浏览器并不支持这种格式，所以，.fla格式的文件是不能放入页面中直接使用的。 后缀名为.swf的文件，是将.fla格式的文件经过压缩后得到的一种小容量的Flash文件格式，这种格式的文件可以直接放到页面中使用。用户在打开页面时，只有安装了特殊的播放器，才能加载并显示这些Flash