Dreamweaver的超级技巧汇总(1)

Post by 张美工, 2009-5-8, Views:

      从这章开始,张美工将连续7章与广大网站设计者们分离Dreamweaver的超级技巧汇总,希望在共同学习的过程中搭一个小桥.每章开头都会有一个目录表,以方便大家查找学习.
     
       1. 用Dreamweaver 4.0轻松设计会自动弹性调整的网页                           
  首先需要保证的是你的页面内容采用了表格的格式,然后打开你要编辑的页面,按“Ctrl+F6”或者菜单“View→TableView→Layout?View”转换到布局视图。这时可以看到单元格的列宽,在列宽数字的旁边还有一个小小的下拉式箭头,点击你要设定弹性显示的列上方的小箭头,接着选择“将列设为弹性显示”(Make Column Autostretch)。该列方框上方就会出现一条波浪形的线,而不是刚才表示列宽的数字。完成后你的页面就变成了一个具有弹性的页面了。此外,需要注意页面中不要有尺寸过大的图片。

       2. 用Dreamweaver 4.0制作有闪动效果的Flash按钮                           
  选择菜单Insert→Interactive?Images→Flash?Button就可看到有哪些内嵌按钮。在弹出的对话框里,你可以在“Style”列表里选择自己想要的按钮样式,在预览(Sample)窗口里可以看到这种样式的效果如何。选择好之后,在“Button?Text”窗口输入按钮上面的文字,在“Font”窗口选择字体,在“Size”窗口输入文字的大小,在“Link”窗口输入链接的目标,在“Target”窗口选择链接打开的方式,在“BgColor”选择按钮背景颜色,在“Save?As”窗口输入保存的文件名。完成这些后,按下“OK”按钮,你就完成了一个Flash按钮啦。这个按钮还会自动插入你的网页中,然后在Dreamweaver编辑窗口选中你刚才制作的按钮,属性窗口就会显示出这个按钮的属性,单击上面的“Play”按钮,你就可直接在编辑窗口预览这个按钮的闪动效果。需要注意的是Dreamweaver?4.0的这个功能不支持中文字体。

       3. 在Dreamweaver 4.0中自定义键盘快捷键                              
  选择菜单“Edit→Keyboard?Shortcuts”,在对话框中会列出目前已经启用的以及可以更改的快捷键一览表,你可以在这里把快捷键改成自己习惯用的。如果要更改快捷键,首先要选取你要更改的命令,接着选取目前的快捷键,这个快捷键就会出现在“Shortcuts”列表中,然后在“Press Key”窗口输入你想要使用的快捷键,然后点击“Change”按钮更改即可完毕。你还可以利用“+”、“-”按钮增加或者删除当前的快捷键。

  4. 让Dreamweaver?4.0和Fireworks整合                                          
  如果你的电脑里同时安装了Dreamweaver/Fireworks,那么你就可以使用Dreamweaver?4.0提供的整合Fireworks的功能。利用这个功能你可以把你的GIF图片修改得更加动人,轻松地实现动画效果。在Dreamweaver编辑窗口选择好你要修改的GIF图片,然后在图片属性窗口单击“编辑(Edit)”按钮,这时系统会自动启动Fireworks软件编辑这个图片。仔细看,你会发现Fireworks的图片编辑窗口已出现Editing?From?Dreamweaver这样的文字和图样,也就是说这个图片是为Dreamweaver页面进行图片编辑的。现在我们在Fireworks里选择要编辑的图片,选择菜单“Modify→Animate→Animate?Selection”。在弹出的窗口里设置动画的属性:选定动画的帧数、动画移动的方向、透明度等等。然后把修改好的文件导出即可。这样,在Dreamweaver编辑窗口会自动更新刚才修改好的文件,使你的页面图片动起来。

  5. 巧用网站报告器                                         
  在Dreamweaver?4.0里提供了一个网站报告器,利用这个网站报告器可以帮助你在你的网站众多文件中快速找到和修复错误。单击菜单“Site→Reports”即可启动报告器,选择你要检查的项目,然后单击“Run”按钮即可查出你网站上的一般问题。你也可以自己编写报告器来查出网站上的一些特殊问题 (一般问题通常是一些文本丢失或文档未命名) 。

  6. 快速恢复多次操作                                          
  在制作页面时,我们可能需要不停地修改页面,有时还要恢复过去的操作,我们可以使用“Edit”菜单里的“Undo”命令,可是这个命令每次只能恢复一次,如果我们需要恢复多次操作,那就要不停地“Undo”,实在太烦。在Dreamweaver?4.0里提供了一个History窗口,可以让我们轻松地恢复多次操作。在“Windows”菜单里选择“History”即可开启这个历史窗口。在这个窗口把你每一次的操作都保留下来了,利用窗口左边那个滑动指针,就可以不停地恢复,还可以撤销每一次操作,包括已经存盘的。而且还可以把这个历史纪录保存下来共享。

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

  8. 快速预览网页                                          
  初学Dreamweaver,往往找不到预览菜单,不得不另外启动IE浏览器来预览网页的实际效果。其实Dreamweaver的预览菜单放到File菜单下了,要预览正在编辑的网页,按F12键就可以了,方便得很呢!而且还可设置在不同的浏览器中预览,在File菜单下的Preview in Browser中选择Edit Browser List就可选择不同的浏览器进行预览。以测试你的网页对不同浏览器的适应性。

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

  10. 如何获得颜色的十六进制代码                                          
  在设计网页时,有时要用到16进制的颜色代码,以前经常为这事头痛,在Dreamweaver中只要按属性面板上“bg”边上小方框右下角的小三角形,在弹出的颜色板上,鼠标指到哪儿,马上就能显示出相应颜色的16进制代码,真方便。

  11. 制作背景音乐                                            
  在Dreamweaver中插入背景音乐是非常容易实现的,这里介绍两种方法,由大家选择。
(1)在页面不显眼的地方插入一空层 ,并在层内放入一个ActivX对象 ,双击该对象,在打开的对话框中选择一个MIDI音乐文件,然后在层对象属性面板中设定其可视性为“Hidden”,保存变动后按F12预览网页,听听是否有音乐声。
(2)另一种方法是利用Dreamweaver的“Behaviors”行为编辑器 ,单击“+”按钮,选择其中“Play Sound”选项,在弹出的对话框中选择一个音乐文件即可。自己动手试一试吧!

  12. 让背景图不滚动                                          
  与FrontPage不同,Dreamweaver中插入的背景图是会随文字滚动的。有的时候我们需要制作固定的背景图,怎么办呢?先定义一张背景图,按“F10”打开HTML源文件,找到定义背景图片的语句,例如background=″images/background.JPG″,在它的后面空一格加上一句bgproperties=″fixed″。预览一下,是不是有点小小的成就感。

  13. 定义大小不变的文字                                       
  为什么别人网页上的文字那么漂亮,不管你怎么按浏览器字体按钮上的大小,他们的字体尺寸都不会发生变化。其实他们使用了网页中的“CSS”样式表技术,在Dreamweaver中要实现这一功能是非常简单的。首先按“F7”或者选择“窗口”菜单中的“样式表”选项打开样式表编辑器,在窗口中单击鼠标右键选择“新建”,在弹出的对话框中输入需要定义的样式表名称,按“确定”,然后在列表中选择第一项“类型”,并给具体的文字属性定义参数(一般来说文字的大小在800×600的屏幕中选择10.5较为适宜),按“确定”后,定义好的样式表就出现了。选择网页编辑窗中的文本,单击新的样式表名,可以看到选中的文本发生的变化。预览一下,试试定义的文本字体尺寸还会不会随浏览器的选择字体大小而改变。

  14. 插入Flash动画                                          
  Macromedia公司的Flash动画因其具有交互性、传送速度快等特点,已逐渐成为网页制作的一项新武器,如果你的网页上能插入一段Flash动画,那么一定会使你的作品增色不少。在Dreamweaver中插入Flash制作的SWF格式动画十分容易,单击对象工具栏上的Flash徽标或单击的“媒体”下的“Flash”,就可以打开选择SWF动画文件的对话框了,选好文件后可在其属性面板中设定播放的参数,即大功告成。
 ----------------------------------------------------------------------------------------------
. 用Dreamweaver 4.0轻松设计会自动弹性调整的网页
 2. 用Dreamweaver 4.0制作有闪动效果的Flash按钮
 3. 在Dreamweaver 4.0中自定义键盘快捷键
 4. 让Dreamweaver?4.0和Fireworks整合
 5. 巧用网站报告器                                            6. 快速恢复多次操作
 7. 隐藏浮动面板
 8. 快速预览网页                  9. 在HTML检示窗中显示行号和自动换行
10. 如何获得颜色的十六进制代码                            11. 制作背景音乐
12. 让背景图不滚动                                       13. 定义大小不变的文字
14. 插入Flash动画

15. 让表格给网页留白                                    16. 改变状态栏提示文字
17. 整合的文本代码编辑器           18. 在Dreamweaver中输入多个空格
19. 解决Dreamweaver的BUG之一
20. 用Dreamweaver 3.0的模版制作网页,设置行为(Behavior)
21. 给文字施加行为(Behavior),制作动态文字特效
22. 精确定位网页中各个元素的位置           23. 改变浏览者的鼠标形状
24. 去掉超链接文字之下的下划线        25. 制作一个跟着页面走的图像
26. 制作鼠标移上去后有变化的动态菜单
27. 用Dreamweaver制作出一个类似于下拉菜单的效果
28. 轻松制作下载文件        29. 利用Dreamweaver的书签制作跳转链接
30. 去掉图片和表格接触地方的空隙

31. 用TracingImage帮助定位网页中各元素的位置
32. Convert Table widths to Pixels和Convert Table widths to Percent
33. 调用Style而不致使网页原代码混乱不堪
34. 使用定制窗口功能测试网页在不同分辨率下的效果
35. 上传网站时无需使用第三方FTP软件
36. 实现用鼠标指向链接时出现下划线的效果
37. 实现定义的超级链接文字颜色
38.在Dreamweaver中把图形放在最中间
39.如何使用Behaviors 功能,而又不链接到任何地方去
40.实现在一张(较大)图片上做出几个不同的链接
41. 制作目录树                         42. 在Dreamweaver中轻松设置行间距

43. 如何设计能使浏览者在浏览时对网页字体大小的设置不起作用
44. 实现网页每过五分钟刷新一次的效果
45. 解决用IE预览正常的链接网页,上传到网站却看不见的现象
46. 制作新开一个窗口打开网页的超级链接(即原来的网页不被覆盖)
47. 隐藏不必要的标签                         48. 解决表格紧贴左上方的问题
49. 在Dreamweaver中将图设为透明alpha设置         50. 设置表格虚线
51. 在Dreamweaver中使插入的FLASH透明
52. Dreamweaver4中设置表格亮边框和暗边框
53. 隐藏表格的分隔线                          54. 如何选取被遮盖或隐藏的层
55. 在层(或表格中)上编辑文本时自动换行
56. 在Dreamweaver中输入上下标                      57. 去掉链接的下划线

58. 关于Dreamweaver中加入空格的问题        59. 制做收藏夹里的ICON
60. 解决Dreamweaver表格里的背景不能预览问题
61. 在Dreamweaver中准确地定位层                   62. 设置网页定时关闭
63. 设置timeline中的layer走曲线               64. 使字体适应不同的分辨率
65. 善用拖放技术      66. 善于为对象取名     67. 多用快捷键来提高效率
68. 一次链接到两个网页      69. 利用“Format Table”命令来修饰网页
70. 尽量不要给文件起中文名称              71. 经常保存当前被编辑的文件
72. 自动在网页中加入更新时间

73. 只复制编辑区中的文字                                  74. 定义网页的关键字
75. 实现浏览器状态栏中的滚动字幕            76. 将 DW 集成到IE浏览器
77. 避免点击空链接对象时会跳到页面顶端的现象
78. 解决使用CSS 、层时,在不同浏览器的效果不同甚至出现错位现象
79. 在网页中加入EMAIL链接并显示预定的主题    80. 制作电子邮件表单
81. 避免别人将你的网页放入他的框架(FRAME)中
82. 定义网页的关键字(KeyWords)       83. 使表格TABLE没有边框线
84. 定时载入另一个网页内容                            85. 改变状态栏提示文字
86. 在Dreamweaver中设置水平标尺的颜色

章出处:北大青鸟  http://www.gz-benet.com.cn  

Tags: Dreamweaver 超级技巧汇总 
分类:css+div | 评论:0 | 引用:0
上一篇: Dreamweaver的超级技巧汇总(2)
下一篇:在线QQ MSN TEL交谈工具代码

或许你还对下面的文章感兴趣

Comments

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

<#template:pagebar#>

最新文章

最新评论

Guest