26. 制作鼠标移上去后有变化
动态菜单 所谓动态菜单其实是两幅图
幅是鼠标不放在上面所显示另副是鼠标移上去所显示
我们可以利用Dreamweaver提供行为的中swap image来实现这个效果首先插入副图片用鼠标单击它在属性面版连接栏内输入要连接网页然后打开行为面板添点击“+”号选择swap image接着出现个窗口要你选择鼠标移上去后所显示图片在此选择第 2副图片点击“确定”好了效果完成了多简单 27. 用Dreamweaver制作出
个类似于下拉菜单效果 制作
个类似于下拉菜单效果需要用到层隐藏和显示特性具体思路方法是:在页面中插入个单行多列表格作为你菜单条表格列数由菜单选项多少决定插入个层在层中输入第个下拉菜单内容并把这个层移动到表格第列下面同理对其他菜单项也作如上操作插入相应层把所有层显示属性(vis)改为隐藏(Hidden) 选择表格
第个单元单击窗口(Windows)→行为(Behaviors)弹出行为面板按下“+”添加行为Show-Hide layers并将第个层(Layer1)属性改为显示(Show)其他层属性改为隐藏(Hide)接着在行为面板中编辑这个行为将它触发事件(events)改为onMouseover这样当鼠标移动到第个表格单元的上时第个下拉菜单就会显示出来接着再添加个行为Show-Hide layers并将所有层属性改为隐藏接着在行为面板中编辑这个行为将它触发事件(events)改为onMouseout这样当鼠标从第个表格单元的上移开时第个下拉菜单就会隐藏起来对其他菜单项重复上述操作但要注意设置“菜单 2”时第 2层显示其他层隐藏；设置“菜单 3”时第 3层显示其他层隐藏；依此类推下去好了做好了按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具体使用是这样:首先使用各种绘图软件Software作出个想象中网页排版格局图然后将此图保存为网络图像格式(包括g
、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. 上传网站WebSite时无需使用第 3方FTP软件Software
Dreamweaver中融入了FTP功能
而且为网站WebSite上传作了优化我们可以做个简单比较当你使用般FTP软件Software上传网站WebSite时是不是都按本地机上网站WebSite目录在服务器中新建目录然后再个个文件上传这种做法实在没错但由于本地机中网站WebSite目录中并不是每个文件都被网页(比如在建网页时留下备份文件)所以筛选文件繁重工作量只有用户自己知道但使用Dreamweaver上传网页就可以方便得多由于FTP功能在幕后为用户进行了许多必要工作所以用户只要将网站WebSite地图内相关HTML文件上传Dreamweaver就会自动将和此HTML文件相关所有其他本地文件并上传(如图像、ZIP文件、FLASH文件甚至是各种REAL文件)使用Dreamweaver内带FTP功能具体做法是:编辑已经定义过SITE在“Site Definition for...”面板中选择“Web Server Info”如果网页是通过FTP方式上传话将“Server Access”设为FTP在FTP Host中添入FTP服务器地址在Host Directory中添入远程登入目录在Login中添入用户名再填好Password经过了以上设定就可以在Site面板中按Connect按钮当Dreamweaver成功连入服务器后Connect按钮会自动变为Disconnect并且在旁亮起个小绿灯接着要做事就是在要上传HTML文件上单击右键选择“Put”即可当此HTML文件上传成功后状态条中将显示Put Depanding File介绍说明Dreamweaver正在上传这个HTML文件所其他本地文件不仅如此Dreamweaver还可以直接下载服务器上文件进行修改思路方法么只要使试试Put旁Get按钮就明白了 36. 实现用鼠标指向链接时出现下划线
效果 有些网页
链接原先没有下划线你把鼠标指向链接处才会出现下划线鼠标移掉下划线就又没有了这种效果其实可以用层叠样式表(CSS)来实现在Dreamweaver中编辑层叠样式表不用编写代码具体操作思路方法如下: (1)在快速启动栏中点击层叠样式表按钮(就是把鼠标放上去显示“show css styles”
那个按钮)在弹出CSS Styles面板上双击(none)； (2)此时
可看到弹出Edit Style Sheet 面板在该面板上按New按钮； (3)再在弹出
New Style 面板上点取Re
HTML Tag(重新定义HTML标记)再在Tag中选择“a”(超级链接标记)标记后按OK按钮；(4)这时可看到弹出Style dehinition for a 对话框在此对话框中可以设置超级链接许多属性你可以按你意愿设置但我们这里主要是要去掉那讨厌下划线所以我们在decoration 属性中选择“none”这样就把下划线去掉了；然后我们再选择颜色为:#339966按ＯＫ按钮返回到Edit Style Sheet 面板； (5)在Edit Style Sheet 面板上再按New按钮；
(6)在弹出
New Style 面板上点取Use CSS Selector 再在该面板上selector选择框中选择“a:hover”(定义当鼠标在超级链接上时链接属性)按OK按钮； (7)在弹出
Style dehinition for a:hover 对话框中我们在decoration 属性中选择“underline”这样就把下划线又加上了；然后我们再选择颜色为:#FF3300按OK按钮返回到Edit Style Sheet 面板； (8)在Edit Style Sheet 面板上再按Don按钮
至此所有设置结束 
最新评论