网页设计与制作实用教程.ppt

书名：网页设计与制作实用教程 ISBN： 978-7-111-25426-3 作者：马绍惠 出版社：机械工业出版社 本书配有电子课件,网页设计与制作实用教程 高职高专 ppt 课件,第2章 初识 Dreamweaver 8,机械工业出版社 2008,网页设计与制作实用教程 高职高专 ppt 课件,学习要求,提前预习，上课认真听讲 课后及时复习，独立认真完成作业,网页设计与制作实用教程 高职高专 ppt 课件,本章重点,了解Dreamweaver 8的工作环境和参数设置 本地站点的建立 Dreamweaver页面的创建等 熟练掌握Dreamweaver的基础知识。,网页设计与制作实用教程 高职高专 ppt 课件,主要内容,2.1 Dreamweaver 8 的基础知识 2.2 Dreamweaver 8 的工作界面 2.3 查找帮助信息 2.4 站点建立和页面属性的设置 2.5 制作简单的网页,网页设计与制作实用教程 高职高专 ppt 课件,2.1 Dreamweaver 8 的基础知识,Macromedia公司的Dreamweaver、 Flash、Fireworks是目前网站建设者与维护人员使用最多的网页制作优秀套件，被称为是网页制作梦幻三组合。这三个软件工具在功能上有着非常紧密完善的结合，同时又有着合理的分工，Dreamweaver主要完成网站的设计与管理工作， Flash主要完成Web动画的制作，Fireworks主要用于完成Web图像的处理。这三个软件虽然功能不同，但是用户界面较为统一，简单易学。 Macromedia Dreamweaver 8是Macromedia最新推出的版本，用于对Web站点、Web页面的开发设计与管理，它集网页制作和网站管理于一身，功能强大，代码简洁，为专业的网页设计者提供了一套所见即所得的、可视化的网页编辑器。,网页设计与制作实用教程 高职高专 ppt 课件,主要内容,2.1 Dreamweaver 8 的基础知识 2.2 Dreamweaver 8 的工作界面 2.3 查找帮助信息 2.4 站点建立和页面属性的设置 2.5 制作简单的网页,网页设计与制作实用教程 高职高专 ppt 课件,2.2 Dreamweaver 8 的工作界面,启动方法 在Windows XP操作系统下，单击“开始”“所有程序” “Macromedia”“Macromedia Dreamweaver 8”菜单命令，就可以启动Dreamweaver 8 标题栏和菜单栏 启动Dreamweaver 后，文字Dreamweaver将显示于标题栏，新建或打开一个文档后，在后面还会显示该文档所在的位置和文件名称。 在标题栏的下方是菜单栏，在菜单栏中包括“文件”、“编辑”、“查看”、“插入”、“修改”、“文本”、“命令”、“控制”、“窗口”和“帮助”共10个菜单项。可通过菜单执行所需命令。 “插入”工具栏,网页设计与制作实用教程 高职高专 ppt 课件,一个各种工具的集成面板，它有一个下拉列表，可以从中选择不同的工具集合。当鼠标指针指到这些工具上时，会出现相应的提示信息显示它的名称。 文档窗口 是用户创建和编辑网页的区域。 状态栏 主要包括标签选择器、窗口大小选择器及页面下载速度指示器等。 “属性”面板 “属性”面板中的内容根据文档窗口中选定对象的不同而不同。利用对文档中选定对象的属性进行精确的调整。,2.2 Dreamweaver 8 的工作界面,网页设计与制作实用教程 高职高专 ppt 课件,主要内容,2.1 Dreamweaver 8 的基础知识 2.2 Dreamweaver 8 的工作界面 2.3 查找帮助信息 2.4 站点建立和页面属性的设置 2.5 制作简单的网页,网页设计与制作实用教程 高职高专 ppt 课件,2.3 查找帮助信息,启动帮助系统 若想了解Dreamweaver详细的功能与作用方法可使用Dreamweaver的帮助系统。 在网页编辑过程中，想了解当前操作的信息时，Dreamweaver在大多数的对话框中都有一个“帮助”按钮，单击该按钮则会直接转到帮助系统中与该操作相关的页面上。 使用查询帮助系统 在“帮助”对话框中提供了四种帮助方式：“目录”、“索引”、“搜索”和“书签”。 要在Dreamweaver帮助中了解与某一主题相关的帮助信息时，须利用“搜索”选项，在“键入要查找的关键字”文本框中键入相应的关键字，然后单击“列出主题”按钮；并双击结果列表中的一个主题，可在“帮助”对话框右侧的窗口中显示该主题的相关内容。,可在“帮助”对话框右侧的窗口中显示该主题的相关内容。,2.3 查找帮助信息,2.1 Dreamweaver 8 的基础知识 2.2 Dreamweaver 8 的工作界面 2.3 查找帮助信息 2.4 站点建立和页面属性的设置 2.5 制作简单的网页,主要内容,2.4 本地站点的建立和页面属性的设置,本地站点的建立 建立本地站点就是在本地计算机上建立一个文件夹，用来存放网站中所有的文件与文件夹。在创建站点前，首先要建立一文件夹，然后就可以建立本地站点了。 站点定义完后还可以根据需要进行修改，方法是在管理站点”对话框中单击“编辑”按钮，然后会调出 “站点定义”对话框，单击“高级”选项卡可以对站点进行重新设置。 页面属性的设置 在Dreamweaver中创建的新网页默认背景色为白色在实际建设时为了使网站具有一定的特征，一般要先对页面的属性进行设置，方法是单击“属性”面板中的“页面属性”按钮，可打开的“页面属性”对话框, 设置外观 “外观”是设置页面的一些基本属性，可以根据需要自行定义。 设置链接 “链接”选项内是一些与页面的链接效果有关的设置。“链接颜色”定义超链接文本默认状态下的字体颜色，“变换图像链接”定义鼠标放在链接上时文本的颜色，“已访问链接”定义访问过链接的颜色，“活动链接”定义活动链接的颜色。“下划线样式”可以定义链接的下划线样式。 设置跟踪图像 跟踪图像是在复制设计时作为参考的图像。它显示在工作区中，但不可编辑，且浏览网页时，跟踪图像自动隐藏。导入时单击右边的“浏览”按钮，在弹出的对话框中可选择图像插入。透明度确定跟踪同的不透明度，从完全透明到完全不透明。,2.4 本地站点的建立和页面属性的设置,主要内容,2.1 Dreamweaver 8 的基础知识 2.2 Dreamweaver 8 的工作界面 2.3 查找帮助信息 2.4 站点的建立和页面属性的设置 2.5 制作简单的网页,2.5 用Dreamweaver制作简单的网页,创建空白文档 在Dreamweaver中,网页被称为是文档，文档的新建、打开、保存与关闭是最基本的操作。新建一文档的操作是单击“文件”“新建”菜单命令，可打开“新建文档”对话框。 存储文档 文档编辑完后，单击“文件”“保存”菜单命令，在打开的“另存为“对话框中输入文件名，并选择文档的保存类型，保存类型选项列表中有20多种文件形式，可选择“HTML文档”类型。单击“保存”按钮，文档就被保存了。但所保存文件的路径一定要选择在站点文件夹下。,关闭文档 单击“文件”“关闭”菜单命令，将关闭当前活动窗口。 打开现有文档 单击“文件”“打开” 菜单命令，在弹出的“打开”对话框中，选择要打开的文档，单击“打开”按钮即可。 打开现有文档也可在Dreamweaver的起始页中实现 网页的浏览 Dreamweaver的“设计”视图提供了页面在Web上显示时的大致外观，要查看确切的最终结果，须在浏览器中预览页面。按快捷键【F12】或单击“文件”“在浏览器中预览”即可。,2.5 用Dreamweaver制作简单的网页,本章小结,Dreamweaver 8 是由Mac