Dreamweaver3 使用中的小技巧

【 tulaoshi.com - Web开发 】

　　一款利器能让你在制作网页中事半功倍，现在用于网页辅助编辑的软件，可谓层出不穷，如大名鼎鼎的FrontPage、Pagemail、Hotdog、HomeSite等。它们在功能上各有千秋，也有各自所适应的范围。但总的来说现在在网络中使用最为广泛的莫数Microsoft Frontpage98（2000）了，它可谓是所见即所得的网页编辑软件中的龙头老大。然而Dreamweaver3.0作为这方面的后期之秀，不论在功能的完善方面，还是使用的便捷上完全超越了FrontPage98，真是一匹黑马。现在越来越多的网页设计者正转入Dreamweaver3的阵营，在Internet上出许多Dreamweaver Fan's Page，Dreamweaver有望成为网页设计方面的工业标准。我在接触了Dreamweaver3后，她的强在功能和便捷使用令我惊叹不已，从而我不得不放下用了多年的FrontPage。但毕竟Dreamweaver和FrontPage是出自两家软件公司，在风格上还是有不少差异，我在这里把我这几个月的使用积累的小经验写出来，供大家参考。

　　1、如何隐藏浮动面板

　　打开Dreamweaver3，给人的第一印象是一堆浮动面板，往往弄得你眼花缭乱，虽然它可以拖开，但毕竟占据着本来就很有限的屏幕，若把它关闭了，等一下用它时又要去打开。其实你只要按一下F4键，所有浮动面板都不见，再按F4他们又都有重现于屏幕上了。

　　2、如何预览网页

　　初入Dreamweaver3 ，往往找不到预览菜单，不得不另外启动IE来预览网页的实际效果；其实Dreamweaver3的预览菜单放到File 菜单下了，因我除了打开或关闭文件，平时对File菜单是不屑一顾的，用了Dreamweaver3半个多月，在一次偶然的机会发现了它。开始我还讲Dreamweaver3怎么不设计预览功能呢？其实要预览正在编的网页，按F12键一切OK了，方便得很呢！而且还可设置在不同的浏览器中预览，在File菜单下的Preview in Browser中选择Edit Browser List就可选择不同的浏览器进行预览。以测试你的网页对不同浏览器的适应性。

　　3、如何在HTML检示窗中显示行号和自动换行

　　虽然Dreamweaver3的Behaviors是一个Javascript小程序的巨集，许多实现特殊网页效果的JavaScript程序都不用动手编程，但有时需要编写一点小程序时，显示程序行号显得犹为必要，特别是在程序发生错误时，往往都有是提示在“XX行有错误”，若一行一行地去数行号可太累了且容易数错，在FrontPage中我老是为数错行号而烦恼。在Dreamweaver3中可方便了，只要在HTML源代码检视器窗口中，选中“Line Numbers”（行号）复选框，则会在源代码检视器窗口中对每条HTML语句自动显示行号，一目了然。同样有时一行代码较长，只要在HTML源代码检视器窗口中，选中“Warp”（自动换行）复选框，则会激活窗口的自动换行特性，过长的代码会自动从窗口的边缘回绕。

　　4、如何获得颜色的十六进制代码

　　在设计网页时，有进要用到16进制的颜色代码，以前经常为这事头痛，在Dreamweaver3中只要按属性面板上“bg”边上小方框右下角的小三角形，在弹出的颜色板上，鼠标指到那马上就显示出那种颜色的16进制代码（见下图），真方便。

图1（颜色板图）

　　5、如何在网页中插入注释

　　在源代码适当的位置添加注释是很好的习惯，因为一但代码过长，很可能连编写者最后都会产生混淆，良好的注释有助于对源代码的理解，也便于维护。

　　要在Dreamweaver3中插入注释信息，您可以按照如下方法进行操作：

　　1）在对象面板上，打开下拉列表，选择“Invisible”（不可见），显示不可见元素的插入按钮，如图 2所示。

图2 （不可见元素的插入按钮）

　　2）单击“Insert Comments”（插入注释）按钮，会打开如下图所示的对话框，允许您输入注释文本。您也可以通过打开“Insert”（插入）菜单，选择“Comment”（注释）命令来插入注释。

图3 （注释文本输入窗）

　　3）按下“OK”按钮，确定操作，这时文档窗口中插入点所在位置就被添加上注释信息。注释信息以一个图标的形式出现，如下图所示。

图4 （注释图标）

　　在HTML语言规范中，注释内容包含在标记中，在上面的例子里，实际上生成的是如下语句：

　　6、如何隐藏和显示不可见元素

　　网页有些元素是不可见的（如层的代号、一段JavaScript程序等），这些元素在文档编辑窗口中Dreamweaver3用一个小图标来表示，这样影响了文档窗口的可视化。在文档窗口中隐藏或显示不可见元素方法如下：

　　打开“View”（查看）菜单，选择“Invisible Elements”（不可见元素）命令，清除对该菜单项的选择，则所有的不可见元素都不会显示在文档窗口中。

　　再次打开“View”（查看）菜单，选择“Invisible Elements”（不可见元素）命令，当它被选中时，左方会出现选中的标记，这时即激活了Dreamweaver3的显示不可见元素特性，不可见元素又出现在文档窗口中。

　　7、如何一次撒消多次误操作

　　在编制网页的过程中，误操作是难免的，利用历史面板撒消误操作，既快捷又方便。利用历史面板最大的优势在于，它可以一次撤销多步误操作。

　　您可以按照如下方法进行操作：

　　1. 按F9显示历史面板，历史面板上会显示当前的进行过的操作列表。

　　2. 在历史面板上，找到希望撤销的最后一步。

　　3. 拖动滑块到该步骤所在的位置，也可以直接单击该位置列表左端位置，这时滑块会自动跳到该位置上。

　　4. 这时文档窗口中自动恢复到撤销操作后的状态，同时历史面板中被撤销的操作列表会变为灰色。如果希望恢复这些操作，可以重新将滑块拖动到该步骤上，这时被撤销的操作又会被恢复。

　　下图显示了利用历史面板撤销多个步骤的情形，在这个例子里，我们将文档恢复到为文字设置粗体格式之后，设置斜体格式之前的状态。

　　注意：一旦撤销了多步操作，然后又进行了新操作，则原先被撤销的操作将不可再恢复，历史面板中被撤销的操作列表会消失，而代之以新的操作步骤。

图5 （历史面板）

　　8、如何选取被遮盖或隐藏的层

　　当层被重叠使用时，大层会把小层遮盖住；当选择了层的隐藏属性，该层就看不见了。当你想对这些层操作时，怎么办？按F11键显示层面板，所有层号均在上面，要那层选择那层就行了。

　　9、如何设置书签和超级连接

　　在Dreamweaver3中设置书签的方法与FrontPage不同。有三种方法：

　　1）在Insert菜单中选择Name Anchor菜单；

　　2）在对象面板（Object）中拉出不可见对象面板，按Name Anchor图标；

　　3）按Ctrl+Alt+A键；

　　然后在弹出的窗口中输入书签名称即可。

　　设置超级连接不是在Insert菜单中，而是在属性面板上的“Link"输入窗中输入超级连接的目标网页名称或用鼠标点击属性面板上的文件夹图标，选择网页文件。

　　10、如何在层（或表格中）上编辑文本时自动换行

　　层在用Dreamweaver3设计网页时被在量采用，但当你在层上输入大段文字时发现不会自动换行，无论你怎样设置层的宽度均无济于事，当然你可以用按“SHIFT+ENTER”来换行。但是这样一当你调整层的宽度时又不得不一个一个地去删除它，再又在另一位置加上它，确实是够麻烦的。经过不断摸索，我发现有三种方法可以解决这个问题：

　　1）在层叠式样表*.CSS中“DIV”的式样定义中加上字体的定义；

　　2）在网页源代码的层定义中加上字体的定义；

　　3）选取该段文字，在文字的属性面板上定义字体。

　　上述三种方法任选一种都行，但以第一种较好，因为只要改动一次，此后只要是调用该层叠式样表的网页中的所有层都有能自动换行了，岂不是一劳永逸。表格同样存在上述问题，解决方法相同，只是在层叠式样表中在“TD”的式样定义中加上字体的定义。

　　总之，记住一个原则：Dreamweaver3是主要是用热键、浮动面板和双向按钮来操作的。而FrontPage是主要是用菜单、对话框来操作的。这是他们在具体操作风格上的主要区别。