一

一、主要界面与基本操作

作 者 : 阿文

　　可以这么说，Micromadia 公司出品的 Dreamweaver，是一个让你很容易上瘾并离不开它的主页制作软件。用 FrontPage 编辑页面的朋友一定印象很深，你想用 FrontPage 编出适合 NetScape 浏览器浏览的主页面，真可谓白了头发也实现不了你的美好愿望，而用 Dreamweaver 就简单多了，它并不跟 IE 或是 NetScape 任何一方有仇，它能够做出适当双方浏览的精美页面来。另外 Dreamweaver 的强大编辑功能，让你能够方便的实现你对页面创作的所有灵感。不必写一行代码，就能够实现 JavaScript、 DHTML 才能实现的特效。它是不是真的有这样奇妙，下面就请你可以跟我一同走入 Dreamweaver 2.0 的世界。

　　一、主要界面与基本操作

　　Dreamweaver 的界面乍看是有点乱，但对于喜欢用它的人来说，这种灵活搭配自由组合未尝不 是一个优点。

　　Dreamweaver 的主界面要由工作区和三大功能面板组成。工作区的最上方是菜单，中间那部分就是页面编辑的空间，底下有状态行提示和窗口尺寸大小显示，在 Dreamweaver 中每次打开或建立一个文件，都将开启一个新的窗口。三大工具面板分别是 Properties、 Objects 和 Launcher。如果工具面板没有显示出来，则到 Windows 菜单下选定这三项。

　　Dreamweaver 的操作和 WORD 之类的文字处理器很相似，常见的文字处理排版功能它都有并且很全面。

　　Properties 面板的功能实现与 Text 菜单相关。也就是说通过这个面板里的设置也都可以在 Text 菜单选择相关命令来设置。随着所选页面内容的不同，是文字，还是表格，或者是图象或其他对象， Properties 面板的显示信息也会有所不同，下面来看第一个例子。

这是在 Dreamweaver 工作区编辑页面的显示：
　　它的 Properties 显示如下：

　　这一行超链接字的一切特性都在此一目了然。字体为加深、斜体的 H1，楷体，颜色为深红色，链接向 study.html 页面， Target 规定了 study.html 将在另一个窗口中显示。

　　Objects 所提供的插入件同时也能在 Insert 菜单里找到，它分为 Common、 Forms、 Head、 Invisible 四个部分。 Dreadmweaver 的一大特色是它可以加载各种插件，方便的实现一些需要大量编程才能实现的功能，例如简单计算器、下拉菜单等，想象起来这些很困难的事情利用插件能很容易就完成了。下载并安装相应插件以后，这些插件也会显示在 Objects 面板之中。现在为了可以看清楚 Objects 中的各种插入件，选择主菜单 Edit/Preferences，在 General 中， Object Palette 的设置改为 Tcons and Text，按 OK 键（如图所示）。

　　现在 Objects 面板显示如图

　　利用 Objects 面板，插入各种元素，例如图像、表格、水平线、层、 Flash、 Form、 Button、 Text Field 及各种 头元素等。用鼠标单击 Image 图标，弹出对话框来让你选择一幅图像，该图像将插入到光标所在的位置。选择这幅图像，再看看 Properties 面板，起了什么变化。

　　Launcher 是所谓快速运行菜单，在 Dreamweaver 工作区状态行的最右边我们可以看到一系列小的图标，与之是相对应的，它的快捷键分别从 F5 - F10。看看最后那个 [HTML]，在工作区的任意操作， HTML 代码都将随之改变，如果想检查某段特定的 HTML 代码，只要把相应内容选择 起来， HTML 代码自动会转移到该处，并高亮度显示。选择例子一的内容，看一下其 HTML CODE 的显示（如图所示）。

　　Dreamweaver 2.0 版提供了强大的 SITE 管理功能，我使用的心得是比 FRONTPAGE 更方便，特别是切换和加载站点的速度快。单击 Site 按钮或按 F5，第一次进行站点管理，会弹出一个对话框，单击“New”选择新建站点， 输入 Site Name （站点名）和 Local Root （路径）， HTTP Address 中填入上传网址。单击 OK。
　　假如有不止一个站点，直接在 Site 的下拉菜单中选取不同的站点，就能够实现站点之间的切换。双击文件在 Dreamweaver 工作区内打开， File 菜单提供了增添新页、新的文件夹等一系列操作。

　　Dreamweaver 的站点管理还提供了链接检查，无论是在 Site 面板中的 File 菜单中或是工作界面的主菜单 File 中，都可以看见有 Check Links 选项，可检验所选文件及文件夹（主菜单仅供检查当前文档）或者整个站点的有效链接。检查进行完毕，弹出的对话框报告了检验链接的结果，共分为三项： Broken Links、 External links 和 Orphan links （检查站点链接时才有这一项）。

　　Broken Links 当然是需要修复的链接。修复的办 法有两个。方法一是直接双击有错误的文件，到 Dreamweaver 工作区去修改，好在它错在哪个链接会以高亮度形式显示出来，你这个文件里包含有太多的链接也不怕。修改完毕 Save 文件。另外在图所示的 Broken Links 那一栏中直接点取错误链接，修改错误链接的文件名或是路径。修改完毕后按 Close 键。

　　在 Dreamweaver 中所做的页面，急于想知道其在 浏览器中的显示效果是否尽如人意。 Dreamweaver 并不象 FrontPage 那样提供了预览功能，但是它可以编辑预览页面的浏览器。它的好处在于，你可以选择一系列不同的浏览器，检查不同浏览器中的页面效果，真正做到跨浏览器的实现。

　　选择主菜单 Preview in Browser/Edit Browser List，如图单击 Add 键增加预览所用的浏览器，并自动提供预览的功能热键，一般来说，默认的预览浏览器功能键为 F12，第二浏览器为 Ctrl+F12 （如图所示）。

　　Dreamweaver 的主要界面和基本操作工作流程的初步介绍到这儿就完成了，从下一章起，你将逐步走进 Dreamweaver 精心营造的梦幻工厂。