Dreamweaver CS4网站设计实例教程 汤文飞 赵晓秋 刘菁 第1章 基础篇新.pptVIP

为了保证网页在不同浏览器中能够正确显示，Dreamweaver提供了相关的检查与验证工具，它们不仅可能找出网页上的错误，还会给出针对不同浏览器的兼容性测试报告。 需要验证当前文档是否符合HTML规范，可以单击【文档】工具栏上的【验证标记】按钮 ，再从弹出菜单中选择【验证当前文档】命令即可。Dreamweaver会在【验证】面板中给出报告。 至于检查不同浏览器对网页的兼容性，只需要单击【文档】工具栏中的【检查页面】按钮 ，然后选择【检查浏览器兼容性】命令即可，报告会在相应的面板中给出。 1.3 Dreamweaver面板 即使是制作单一的网页，也会用到许多的资源，包括HMTL文件、CSS样式表、图片等等。Dreamweaver提供了站点功能来统一组织和管理这些文件。 单击菜单栏【站点】菜单，从弹出的菜单项中选择【新建站点】命令，弹出【站点定义】对话框，切换到【高级】选项卡，在【本地信息】类别中输入站点名称，并选择它在计算上所存放的文件夹目录， 1.4 Dreamweaver中的站点管理 切换到【远程信息】类别，根据网页将要正式发布的Web服务器类型，从【访问】列表中进行正确的设置。只需进行本地测试时，可以选择【无】。这里为方便演示，选择【本地/网络】并设置远端文件夹（将它设置为与本地目录相同）。 1.4 Dreamweaver中的站点管理 切换到【测试服务器】类别，按实际情况测试网页用的服务器模型与访问方式。当访问方式为【本地/网络】时，应确保计算机上已经安装有Web服务器（比如IIS），并根据Web服务器中的配置正确设定【URL前缀】中的内容。 单击【完成】按钮以完成站点添加。需要更改站点的各项设置时，只须选择菜单栏【站点】|【管理站点】命令，此时弹出【管理站点】对话框，在此选择站点名称后单击【编辑】按钮即可修改其设置。 1.3 Dreamweaver面板 在Dreamweaver中添加站点后，就能够在【文件】面板中查看站点中的所有文件了。选择菜单栏【窗口】|【文件】命令以查看【文件】面板，从左侧下拉列表中可以快速切换不同的站点或目录。 1.4 Dreamweaver中的站点管理 面板中的文件使用树状列表组织，可以方便地查看站点中的所有文件。单击【展开】按钮时，可以在展开的视图中同时查看本地与远程文件。通过工具栏上的获取、上传、取出、存回等一系列按钮，可以使得本地与远程的文件保持一致。 1.4 Dreamweaver中的站点管理 位于同一面板组中的【资源】面板将当前站点中的所有资源进行了分类，用户可以单击左侧的分类图标来依次查看不同类型的文件. 1.4 Dreamweaver中的站点管理 对于已经创建的站点，Dreamweaver提供了报告功能来检测单个文档或整个站点，方便设计者发现网页中可能存在的问题。 在【文件】面板中切换到需要检查的站点并选中需要检查的网页文件（可多选），然后选择菜单栏【站点】|【报告】命令，此时弹出【报告】对话框，在【报告在】下拉列表中选择站点报告的范围，从列表框中勾选报告对象后单击【运行】按钮即可执行站点报告。 1.4 Dreamweaver中的站点管理 此时会在【站点报告】面板中给出检查结果以方便查看。单击面板左侧的【报告】按钮 以重新选择报告范围；单击【更多信息】按钮 以查阅相关报告的参考文献；【保存报告】按钮 则用于保存当前报告为独立文档。 1.4 Dreamweaver中的站点管理 对整个整点进行过检查，没有什么严重错误时，就可以发布整个站点或单个网页了。如果为站点定义了远端文件夹或测试服务器文件夹，可以在网页编辑完成后选择菜单栏【站点】|【上传】命令来发布。 1.4 Dreamweaver中的站点管理 在【文件】面板中切换到【远程视图】或【测试服务器】，然后单击【刷新】按钮 以更新远程文件列表。 需要发布整个站点的内容时，逐个上传网页会显得比较麻烦，此时可以选择菜单栏【站点】|【同步站点范围】命令，在弹出的对话框中选择需要同步的内容与同步方向，单击【预览】按钮并确定以执行。 1.4 Dreamweaver中的站点管理 选中图片以调整尺寸并继续为网页添加文本与图片和链接。 1.2 Dreamweaver基本操作 除了使用之前介绍的【文件】|【在浏览器中浏览】命令，还可以单击编辑区【文档】工具中的【在浏览器中预览】按钮，然后在弹出的列表中选择【预览在IExplorer】命令即可调用IE查看页面。默认快捷键为【F.12】 1.2 Dreamweaver基本操作 Dreamweaver的面板集成了大量的实用命令。需要展开某个面板时，选择菜单栏【窗口】命令，然后在弹出的列表项中勾选面板名称即可。Dreamweaver按功能将不同的面板整合在一起，形成为数不多的几个面板组。这里