Dreamweaver终极技巧（下）

　　26. 制作鼠标移上去后有变化的动态菜单

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

　　27. 用Dreamweaver制作出一个类似于下拉菜单的效果

　　制作一个类似于下拉菜单的效果需要用到层的隐藏和显示特性。具体的方法是：在页面中插入一个单行多列的表格，作为您的菜单条。表格的列数由菜单选项的多少决定。插入一个层，在层中输入第一个下拉菜单的内容，并把这个层移动到表格第一列的下面。同理，对其他菜单项也作如上的操作，插入相应的层。把任何层的显示属性(vis)改为隐藏（Hidden）。

　　选择表格的第一个单元，单击窗口（Windows）→行为（Behaviors），弹出行为面板。按下“ ”添加行为Show-Hide layers，并将第一个层（Layer1）属性改为显示(Show)，其他层的属性改为隐藏(Hide)。接着在行为面板中编辑这个行为，将他的触发事件(events)改为onMouseover。这样，当鼠标移动到第一个表格单元之上时，第一个下拉菜单就会显示出来。接着再添加一个行为Show-Hide layers，并将任何层的属性改为隐藏。接着在行为面板中编辑这个行为，将他的触发事件(events)改为onMouseout。这样当鼠标从第一个表格单元之上移开时，第一个下拉菜单就会隐藏起来。对其他的菜单项重复上述操作。但要注意配置“菜单二”时，第二层显示，其他层隐藏；配置“菜单三”时，第三层显示，其他层隐藏；依此类推下去。好了，做好了，按F12看看吧。

　　28. 轻松制作下载文档

　　用Dreamweaver其实很简单，把要让浏览者下载的文档名写上，然后拖动鼠标选取这段文字，在文本的属性面板上“Link”的属性输入框中写上文档名就行了。注意：若被下载的文档和该网页不在同一目录下，则文档名必须包含相对路径，否则在下载时将提示很难找到文档。

　　29. 利用Dreamweaver的书签制作跳转链接

　　利用Dreamweaver的书签我们能够实现这个功能。具体方法是：将光标移到您想跳转到的地方，选择菜单中的“插入（Insert）→书签（Name Anchor）”，输入书签的名称。接下来，在您想调用链接的链接目标框中填入“#书签名称”，这样一个页面内的跳转链接就做好了。在这里，假如我们在书签名称前填入网页的名称，就会跳转到其他页面中的书签处。 比如说我们在Link处填入“index.htm#top”，当浏览者点击这个链接时就会跳转到index页面中的top书签处。

　　30. 去掉图片和表格接触地方的空隙

　　要使图片和表格接触的地方不留空隙，仅在表格属性面板上把外框线（border）设为0是不行的，还需要在表格的属性面板上把单元格的两个属性设为0（即cellspacing="0"和cellpadding="0"）。

　　31. 用TracingImage帮助定位网页中各元素的位置

　　TracingImage是Dreamweaver一个很有效的功能，他允许用户在网页中将原来的图案设计作为辅助的背景。这么一来，用户就能够很方便地定位文字、图像、表格、层等网页元素在该页面中的位置了。TracingImage的具体使用是这样的：首先使用各种绘图软件作出一个想象中的网页排版格局图，然后将此图保存为网络图像格式（包括gif、jpg、jpeg和png）。用Dreamweaver打开您所编辑的网页，在页面的空白区单击右键，选择“Page Properties...”，然后在弹出的对话框中的Tracing Image项中输入刚才创建的网页排版格局图所在位置。再在Image Transparen中设定TracingImage的透明度，OK。这样您就能够在当前网页中方便地定位各个网页元素的位置了。使用了TracingImage的网页在用Dreamweaver编辑时不会再显示背景图案，但当使用浏览器浏览时正好相反，TracingImage不见了，所见的就是经过编辑的网页（当然能够显示背景图案）。

　　32. 关于“Convert Table widths to Pixels”和“Convert Table widths to Percent”

　　“Convert Table widths to Pixels”和“Convert Table widths to Percent”是Dreamweaver两个配置表格宽度的重要功能。当您打开一个带有表格的网页时，在状态栏中点中〈table〉标签，在随后显示出的表格属性工具面板中就能看到这两个按钮了。顾名思义“Convert Table widths to Pixels”就是将表格中任何单元的宽度以像素表示，而“Convert Table widths to Percent”是将表格中任何单元的宽度以百分比表示。仔细想想他们的作用，假如将一个表格的宽度全以像素表示，但浏览窗口被放大时，表格就不会随之放大单元格的宽度。而使用了“Convert Table widths to Percent”后能够使您在640×480分辨率下建立的100%宽的表格在更高的分辨率下依旧保持100%的宽度。所以活用这两个功能能够使网页排版事半功倍。

　　33. 调用Style而不致使网页原代码混乱不堪

　　调用Style的方法很多，您能够单击右键选择Custon Style来调用Style规范，也能够在状态栏中的元素列表上单击右键来调用Style。虽然不同的方法达到的效果看似相同，但实际上产生的HTML代码则完全不同。比如用Custon Style来调用Style规范，在网页代码中就生成一个〈span〉标签，这样标签一多就会使文档十分臃肿而且影响浏览器的解析速度，所以我建议尽量使用状态栏中的元素列表来调用Style。更有一个小技巧，假如您要使用一个Style定义某表格单元中的任何文字，只要在〈td〉标签中调用Style就行了，而无需在一个个定义〈p〉标签。注意这个方法不适用于〈table〉标签，因为在〈table〉标签中用Style定义的文字格式会被Netscape忽略。

　　34. 使用定制窗口功能测试网页在不同分辨率下的效果

　　谁都不希望看见自己辛辛苦苦做的网页在不同的分辨率下面目全非，所以测试网页在不同分辨率下的浏览效果是网页制作中很重要的一步。我们能够在Dreamweaver的操作界面中的状态栏中间，选择需要的分辨率来调节窗口大小，从而实现在不同分辨率下测试网页效果。

　　35. 上传网站时无需使用第三方FTP软件

标签：

版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点，本站所提供的摄影照片，插画，设计作品，如需使用，请与原作者联系，版权归原作者所有