2013年Dreamweaver基础教程.pptVIP

第五章 可视化的网页制作工具 Dreamweaver Dreamweaver是美国著名的软件公司Macromedia推出的一个“所见即所得”的可视化网站开发工具。也是深受国内外专业Web开发人员喜欢的一款软件。本章重点介绍Dreamweaver MX的工作界面、站点管理、组织排版、制作网页、网页发布等功能。 5.1 Dreamweaver的工作界面 Dreamweaver MX的工作界面中包括了标题栏、菜单栏、插入栏、工具栏、“属性”面板、功能面板组、状态栏和文档窗口。与Fireworks和Flash的工作界面基本一致。用户可根据需要把这面板组合在一起或折叠起来，从而构造一个方便的工作环境。 5.1 Dreamweaver的工作界面 1.标题栏 2.菜单栏 3.插入栏 4.工具栏 5.1 Dreamweaver的工作界面 5.1 Dreamweaver的工作界面 5.“属性”面板 6.文档窗口 7.面板组 5.2 Dreamweaver的站点管理 5.2.1 关于Web站点 Web站点是一组具有共同属性（如共同的主题、类似的设计或共同的目的）并相互链接的网页文档的集合。使用Dreamweaver当然可以设计单张的网页，但由于网页一般都要通过超级链接互相进行关联，一些具有共同属性的网页，相互链接在一起，就构成了一个Web站点。如一个小公司的Web站点，往往由公司首页、公司概况、产品介绍、联系方式等网页文档互相链接构成。 5.2 Dreamweaver的站点管理 5.2.1 关于Web站点 站点也是网页文档的在本地磁盘的组织形式，它同样是由文档和文档所在的文件夹组成的。建立站点的第一步就是要在本地硬盘上进行规划，创建一个文件夹（例如在D:盘上建立一个mysite的文件夹）作为保存一个站点所有文档的文件夹，然后再分门别类地创建子文件夹来分别存放不同类别的文档。 5.2 Dreamweaver的站点管理 5.2.1 关于Web站点 只有设置和规划好本地站点的结构，以后网站的维护、更新才能轻松地进行。设置站点就是在本地磁盘上创建一个包含站点所有文件的文件夹（也被称为本地站点），然后在该文件夹中创建和编辑文档。一旦用户创建了站点结构，就必须在Dreamweaver中指定新的站点，当在Dreamweaver中建立了本地站点并设置好FTP后，就可以将站点上传到Web服务器上，并能够自动跟踪和维护链接、相互共享文件了。 5.2 Dreamweaver的站点管理 5.2.2在Dreamweaver中创建一个站点 5.2.3管理本地站点 1.向站点中添加内容 （1）添加文件夹 （2）添加主页 （3）添加普通网页 5.2 Dreamweaver的站点管理 5.2.3管理本地站点 2.管理本地站点 （1）打开站点 （2）编辑站点 （3）打开和删除网页文件 5.2 Dreamweaver的站点管理 5.2.4上传和更新Web站点 1.设置远程站点属性 5.2 Dreamweaver的站点管理 5.2.4上传和更新Web站点 1.设置远程站点属性 5.2 Dreamweaver的站点管理 5.2.4上传和更新Web站点 2.连接和上传文件到远程站点 设置好远程站点的属性后，就可以连接到远程站点了。打开站点面板，切换到远程视图，通过站点工具栏，如图5.15所示，可以方便地完成连接、上传、下载文件等工作。 5.2 Dreamweaver的站点管理 5.2.4上传和更新Web站点 2.连接和上传文件到远程站点 5.3 处理基本网页元素 当本地站点创建完成，在站点中建立的一个个网页文件还是空文档。需要在网页中插入文字、图片以及其他的多媒体对象，如动画、影像、连接到其他文件的链接以及声音，才能成为真正的网页，这个过程就是网页设计。这一切操作主要在文档窗口完成，Dreamweaver MX会自动在文件中加入相应的HTML和其他脚本程序代码。 5.3 处理基本网页元素 5.3.1页面基本属性的设定 设置页面基本属性是网页设计的第一步工作。网页的基本属性包括页面标题、背景图像和颜色、文本和链接颜色，还包括在“文件头”选项卡中定义的信息等内容。这些信息对于用户了解了解网页的基本内容、搜索查找网页都起着非常重要的作用。 5.3 处理基本网页元素 5.3.1页面基本属性的设定 1.设置页面属性 5.3 处理基本网页元素 5.3.1页面基本属性的设定 1.设置页面属性 5.3 处理基本网页元素 5.3.1页面基本属性的设定 2.设置文档头部元素 5.3 处理基本网页元素 5.3.2文本处理 1.插入普通文本 2.插入特殊字符 3.插入日期 4.插入水平线 5.3 处理基本网页元素 5.定义文本格式 在一般情况下，插入的文本都是使用