第9章DREAMWEAVERcs3电子商务网站设计本章要点.pptVIP

本章要点  Dreamweaver CS3的工作界面主要由5部分组成，分别是“插入”面板、“文档”工具栏、“文档”窗口、“属性”面板和控制面板组 ,如下图所示。 1）标题栏：显示当前编辑文档的路径和文件名。2）菜单栏：该栏包含了设计和开发网站的所有命令。3）插入面板：该面板用于创建和插入对象（如表格、层、表单、文本和图像）。插入面板中又包含“常用”、“布局”、“表单”、“数据”、“Spry”、“文本”及“收藏夹”等面板。4）文档工具栏：该栏包含一些比较常用的文档按钮，可以在不同视图，如“代码”视图、“设计”视图和“拆分”视图（同时显示“代码”和“设计”视图）间快速切换；还包含一些与查看文档、在本地和远程站点间传输文档有关的常用命令及选项。5）文档窗口：显示当前创建和编辑的文档。设计网页的工作就是在这里进行的。 9.2 实训 网站的创建与布局9.2.1 创建站点9.2.2 网页表格布局9.3 实训 图像的插入与超链接、特效的制作9.3.1 插入图像及图像对象网页中通常使用的图像格式有jpeg、gif、png这3种，但大多数浏览器只支持jpeg和gif两种图像格式。为了保证浏览网页的速度，网站设计者常使用jpeg和gif这两种压缩格式的图像。 2．插入图像对象（1）插入图像占位符设计网页时，设计者如果暂时找不到合适的图像，可先找一个临时的图像放在最终的位置上作为临时替代。Dreamweaver软件中提供的图像占位符功能，就能满足这个需求；此外，还可以设置占位符的大小和颜色，并为占位符提供文本说明。 1．文本超链接创建文本链接的方法非常简单，只要在【属性】面板中指定链接文件即可。2．图像超链接创建图像链接的方法与创建文本链接的方法类似 。3．热点链接有时需要在一张图上创建多个链接以便打开不同的网页，这就用到了热点链接。  网站创建者总是希望与浏览者多进行互动，一种有效的方法就是让浏览者发送E-mail给自己，这时使用电子邮件超链接就可以轻松实现。5．锚记链接命名锚记就是用户在文档中设置的标记，这些标记通常放在文档的特定主题处或顶部，然后创建这些命名锚记的链接，这些链接可以快速将浏览者带到指定的位置。下面学习设置锚记以便于快速返回到主页的顶端。 1．制作层动画2．制作忽隐忽现的动画 9.4.1 框架网页的设计1．新建、编辑框架 2．制作框架网页  9.5 实训 网页设计综合实例本节介绍网页设计的综合性实例，本实例的最终网页效果如图所示。 9.5.1 制作导航条9.5.2 制作搜索框9.5.3 制作用户登录界面9.5.4 应用CSS样式9.5.5 制作网上调查界面 教 学 小 结通过本章的学习，熟Dreamweaver CS3软件的界面结构，掌握创建站点的方法，能够使用表格、框架进行页面布局，掌握插入图像及超链接、表格、表单的应用等基本技术，能够独立设计并制作网页。 * 第9章 DREAMWEAVER cs3 电子商务网站设计  Dreamweaver CS3的基本操作 创建站点 使用表格布局页面 图像插入及超链接、特效制作 表格、表单和框架的应用 设计并制作完整的网页 9.1 Dreamweaver CS3的基本操作 6）面板组：面板组可以设置为浮动的面板，其中包含“CSS”、“应用程序”、“标签检查器”、“文件”、“框架”、“历史记录”等面板，用户也可以根据自己的习惯重新指定其他面板。7）面板组开关：用来显示和隐藏面板组。隐藏面板组状态下，可以使文档窗口最大化地显示所有内容。8）状态栏：位于文档窗口的下方，其左侧是显示代码标签的主要位置，在此可以选择文档中的代码标记；右侧包含“选取工具”、“手形工具”、“缩放工具”、“设置缩放比例”、“窗口大小”和“下载时间”等功能。9）属性面板：用于查看和更改所选对象（或文本）的各种属性。“属性”面板中的内容根据选定的元素不同会有所不同。 9.3.2 超链接的使用 4．电子邮件超链接 9.3.3 特效的制作 9.4 实训 表格、表单和框架的使用 *