Dreamweaver 使用技巧及问题集锦

前言：

　　Dreamweaver是由Macromedia公司开发的专门针对专业网页制作者的所见即所得的主页编辑工具。它提出了许多独具特色的设计新概念，诸如行为（Behaviors）、时间线（Timeline）、资源库（Library）等。此外,Dreamweaver还支持层叠式样表（CSS）和动态网页效果（DHTML）。利用Dreamweaver，我们可以轻易的制作出另人眼花缭乱动态网页。

  • 我用Dreamweaver怎么只能输入一个空格呀？飞华统计专家

　　这是因为你输入的空格是半角字符， 只要输入全角空格就可以了。输入全角空格的方法是：打开中文输入法，按Shift+Space切换到全角状态。这时你输入的空格就是全角空格了。

  • 在Dreamweaver 3.0中行为面板（Behavior inspector）中，“Events for”下拉菜单项无法打开！默认的只有一个 “3.0 and Later browsers”。这样一来，很多特技效果形同虚设。根本没法制作。

　　这应该算Dreamweaver 3.0和中文Windows98不兼容的一个地方吧，在英文Windows98中就没有这个问题。而实际上这个菜单还是可以打开的，只不过是不能正确显示罢了。在选中下拉菜单后，我们可以用上下键来选择我们想要用的浏览器。就现在来说，我们一般应该选择“IE 5.0”。

  • 我用Dreamweaver 3.0的模版制作网页，为什么行为（Behavior）无法设置呢？如果不使用模版生成网页，却一点问题也没有。

　　在使用模板（Template）做出來的网页中不能新增行为。这是因为新增行为需要在HTML文件的Head部分之中插入JavaScript,而使用了Template后，HTML文件的Head部分会被“封锁”住。如果要在使用模板生成的网页中应用行为，你就需要事先在模板中定义好行为，然后把它定义为模板的可编辑区域。随后，你就可以在网页中更改这个行为了。但这也只限于更改行为的触发事件（events）和动作（actions）的具体内容，而不能更改动作的类型。

　　比如说，我们事先在模板中为一个对象定义了一个行为，这个行为是当载入页面时（onload）弹出一个消息对话框（popup message）。当我们编辑由这个模板生成的页面时，我们可以把onload改为onunload，或者我们可以改变消息对话框的具体内容，而不能把popup message这个动作改成play sound。

  • 我能否使文字像图片那样，可以在上面施加行为（Behavior）？这样我就可以作出类似动态按钮那样的动态文字特效了。

　　在Dreamweaver中普通的文字是以字符为单位的，不能作为对象，即一些非常有用的JavaScript事件不能赋予文字。因为文字不象图片和其他控件有具体的“标记”，所以文字与很多特效失之交臂。

　　为了给文字添加特效，我们可以把文字做成超链接来处理。这样文字就成为了对象，可以施加行为了。但是这样又带来了一些不需要的超链接属性，比如下划线，以及hover、visited等颜色变化。 如果你想单纯为文字添加特效，下面我有一个办法：我们可以先把你所想设置的文字做成超链接，然后再在它的上面添加行为，最后我们再把超链接转变为普通文字。具体的步骤如下：

  1. 选中你想编辑的文字，在链接目标框里随便填入几个字符。
  2. 选中这个链接，单击窗口（Windows)->行为（Behaviors），弹出行为面板。
  3. 按下“+”添加你想要的行为，如play sound等。
  4. 打开Dreamweaver的超文本编辑器，找到这个链接，把<a>改为<font>，把</a>改为</font>。最后把“href=...”删掉。
  5. 保存此页。按F12预览一下，怎么样效果还不错吧。
  • 如何精确的定位网页中各个元素的位置呢？

　　精确定位网页中各个元素的位置有两种方法：使用表格或层。

　　使用表格是目前比较通用的做法，具体方法是：先在网页中建立一个表格，注意表格的边框宽度应为０。然后再把各个元素按照你的要求放在各个表格单元之中。仔细调整表格单元的大小以及表格边框的位置，这时在表格单元中的元素也会随之移动位置。这样你就可以比较精确的定位网页中各个元素的位置了。使用表格的优点是通用，几乎各个版本的浏览器可以致支持表格。它的缺点是使用起来比较麻烦，需要仔细进行调整，而且定位不十分精确。

　　层在网页中可以随意放置，因此我们可以使用层来进行精确定位。使用方法是，在网页中插入一个层，然后把你想要定位的元素放在层里，接着我们就可以把层放到所想要任何位置了。此外，你还可以借助标尺和网格进行精确的定位。

　　因为层只在最新的浏览器中被支持，所以为了兼容旧的浏览器，我们可以把层转变为表格。方法是:选择“修改(Modify)->版面布局模式(Layout Mode)->把层转化成表格(convert layers to table)”即可。注意这时的层不能有重叠，我们可以在插入层之前选择“查看(view)->防止层交错(prevent layer overlaps)”来避免层的重叠。一般来说转换后的页面可能会有一些变化，还需要我们手工进行调整。

　　最后有一点要注意，在进行表格和层的相互转换时，最好不要在一个页面中同时使用层与表格，那样可能会把你的页面弄的一团糟。

  • 如何改变浏览者的鼠标形状？

　　这是通过编辑样式表来实现的。具体方法是：选择“文字（text）->定制样式（CSS Style）->编辑样式表（Edit Style Sheet）”，弹出编辑样式表窗口，在其中选择“新建（new）”。接着选择“建立一个定制的样式（Make custom style),给这个样式表起名,单击确定。编辑该样式表,选择扩展项(extension)，在右边的光标项（Cursor)中选择要出现的指针效果即可。

  • 如何让背景图象不滚动？

　　选择“文字（text）->定制样式（CSS Style）->编辑样式表（Edit Style Sheet）”，出现编辑样式表窗口，选择“新建（new）。接着选择重定义HTML标记（Redefine HTML Tag）”，并在下面的标记(Tag)选单中选择Body。编辑该样式表,选择背景（Background），并在右边的附件（Attachment）里选固定的（fixed）就可以了。

  • 我如何才能去掉超链接文字之下的下划线呢？

　　这一效果也是通过编辑样式表来实现的。具体方法是：“点击文字（text）->定制样式（CSS Style）->编辑样式表（Edit Style Sheet）”，出现编辑样式表窗口，选择“新建（new）”。接着选择重定义HTML标记（Redefine HTML Tag）”，并在下面的标记(Tag)选单中选择a。编辑该样式表,选择类型(type),在右边的装饰（decoration）中选中无（none ）即可。

  • 我如何制作一个跟着页面走的图象呢？

　　这一效果是通过Javascript实现的。一般来说完成这样一个效果需要一定的编程能力，但现在我们可以通过Dreamweaver的插件轻易的实现。你可以到http://www.computerinfo.com.cn/classroom/chajian　/chajian2.zip下载这个插件。插件的安装方法：解压缩后拷贝到dreamweaver下的文件夹Configuration\Objects内的一个新建文件夹里面即可。重新启动Dreamweaver之后，我们就可以在对象面板之中找到新安装的插件了。点击插件的图标，在弹出的对话框中填入图像的存放地址以及图像的显示位置就可以了。

  • 如何制作鼠标移上去后有变化的动态菜单?

　　所谓动态菜单其实是两幅图，一幅是鼠标不放在上面所显示的,另一副是鼠标移上去所显示的。我们可以利用Dreamweaver提供的行为之中的swap image来实现这个效果。首先插入一副图片，用鼠标单击图一，在属性面版的连接栏内输入要连接的网页。然后打开行为面板添，点击“+”号，选择swap image。接着出现一个窗口，要你选择鼠标移上去后所显示的图片，在此选择图二，点击确定。好了，效果完成了，多么的简单。

  • 我如何才能用Dreamweaver制作出一个类似于下拉菜单的效果呢？

　　制作一个类似于下拉菜单的效果需要用到层的隐藏和显示特性。具体的方法是：

  1. 在页面中插入一个单行多列的表格，作为你的菜单条。表格的列数由菜单选项的多少决定。
  2. 插入一个层，在层中输入第一个下拉菜单的内容，并把这个层移动到表格第一列的下面。
  3. 同理，对其它的菜单项也作如上的操作,插入相应的层。
  4. 把所有层的显示属性(vis)改为隐藏（Hidden)。
  5. 选择表格的第一个单元，单击窗口（Windows)->行为（Behaviors），弹出行为面板。按下“+”添加行为Show-Hide layers，并将第一个层（Layer1)属性改为显示(Show),其它层的属性改为隐藏(Hide)。接着在行为面板中编辑这个行为，将它的触发事件(events)改为onMouseover。这样，当鼠标移动到第一个表格单元之上时，第一个下拉菜单就会显示出来。
  6. 接着再添加一个行为Show-Hide layers，并将所有层的属性改为隐藏。接着在行为面板中编辑这个行为，将它的触发事件(events)改为onMouseout。这样当鼠标从第一个表格单元之上移开时，第一个下拉菜单就会隐藏起来。
  7. 对其它的菜单项重复e、f操作。但要注意设置“菜单二”时，第二层显示，其它层隐藏；设置“菜单三”时，第三层显示，其它层隐藏；依此类推下去。

　　好了，做好了，按F12看看效果吧，怎么样？是不是很酷？

  • 我经常看见有的网页上有诸如跳转到页首之类的链接，这是怎么实现的呢？

　　利用Dreamweaver的书签我们可以实现这个功能。具体方法是：将光标移到你想跳转到的地方，选择菜单中的“插入（Insert）->书签（Name Anchor）”，输入书签的名称。接下来，在你想调用的链接处的链接目标框中填入“#书签名称”，这样一个页面内的跳转链接就做好了。

　　在这里，如果我们在书签名称前填入网页的名称，就会跳转到其它页面中的书签处。 比如说我们在Link处填入“index.htm#top"，当浏览者点击这个链接时就会跳转到index页面中的top书签处。

本文发表在《新潮电子》第4期