Dreamweaver的超级技巧汇总(2)

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

  15. 让表格给网页留白                                        
  在Dreamweaver的新网页上输入文字时,默认格式是顶天立地的,十分不美观。要避免这一缺憾其实很简单,只要大家用好表格工具就行了。具体做法是:在新页面上插入一张居中对齐的表格,为了能够使表格方便控制,最好设定奇数列,并且数值不要太大。这样在单元格内输入的文字就被限制在一个可以随意调整宽度的区域内,就不愁文字不听使唤了。

  16. 改变状态栏提示文字                                        
  一般情况下,当浏览器装入一个页面时,在其状态栏上显示的是该页面的地址名称,十分呆板。你有没有想过给浏览器的状态栏增加一点个性呢?如果有的话,那么请按照以下的步骤,定制自己喜欢的文字吧!首先打开“Behaviors”行为编辑窗,单击“+”按钮,选择“Set Text Set”下的“Text Of Status Bar”选项,然后在方框中输入自己的文字,例如“欢迎来到我的主页”等,单击“确定”即可。

  17. 整合的文本代码编辑器                                        
  可视化网页编辑软件的最大不便之处就是很难对源代码进行编辑,更别说JavaScript了;不过Dreamweaver?将使你处理代码变得异常轻松。这个内建的文本代码编辑器主要的新功能是:自动缩排(可以一次选取多行进行缩排),?还可以进行符号的检测,如果在编写代码忘了一个“”,它将给出提示。在工具表中的下拉菜单会列出当前网页中所有自定义JavaScript函数,可让你在网页原代码中自由跳转,“原始码导航工具”可以让专业人士方便地处理JavaScript函数,在文本代码编辑器中输入JavaScript代码,系统将用不同的颜色来显示。

  18. 在Dreamweaver中输入多个空格                                        
  我们平时输入的空格是半角字符,在Dreamweaver中只能输入一个,要想输入多个空格只要输入全角空格就可以了。输入全角空格的方法是:打开中文输入法,按Shift+Space切换到全角状态。这时你输入的空格就是全角空格了。

  19. 解决Dreamweaver的BUG之一                                   
  在Dreamweaver 3.0中行为面板(Behavior inspector)中,“Events for”下拉菜单项无法打开。这样一来,很多特技效果形同虚设,根本没法制作。其实这应该算Dreamweaver 3.0和中文Windows98不兼容的一个地方吧,在英文Windows98中就没有这个问题。而实际上这个菜单还是可以打开的,只不过是不能正确显示罢了。在选中下拉菜单后,我们可以用上下键来选择我们想要用的浏览器。

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

  21. 给文字施加行为(Behavior),制作动态文字特效                                   
  在Dreamweaver中普通的文字是以字符为单位的,不能作为对象,即一些非常有用的JavaScript事件不能赋予文字。因为文字不像图片和其他控件有具体的“标记”,所以文字与很多特效失之交臂。为了给文字添加特效,只有把文字做成超链接来处理。这样文字就成为了对象,可以施加行为了。但是这样又带来了一些不需要的超链接属性,比如下划线,以及hover、visited等颜色变化。 要想单纯为文字添加特效,可以先把所想设置的文字做成超链接,然后再在它的上面添加行为,最后我们再把超链接转变为普通文字。具体的步骤如下:
选中你想编辑的文字,在链接目标框里随便填入几个字符。选中这个链接,单击窗口(Windows)→行为(Behaviors),弹出行为面板。按下“+”添加你想要的行为,如play sound等。打开Dreamweaver的超文本编辑器,找到这个链接,把〈a〉改为〈font〉,把〈/a〉改为〈/font〉。最后把“href=...”删掉。保存此页。按F12预览一下。效果还不错吧!

  22. 精确定位网页中各个元素的位置                                   
  精确定位网页中各个元素的位置有两种方法:使用表格或层。使用表格是目前比较通用的做法,具体方法是:先在网页中建立一个表格,注意表格的边框宽度应为0。然后再把各个元素按照你的要求放在各个表格单元之中。仔细调整表格单元的大小以及表格边框的位置,这时在表格单元中的元素也会随之移动位置。这样你就可以比较精确地定位网页中各个元素的位置了。使用表格的优点是通用,几乎各个版本的浏览器可以致支持表格。它的缺点是使用起来比较麻烦,需要仔细进行调整,而且定位不十分精确。层在网页中可以随意放置,因此我们可以使用层来进行精确定位。使用方法是,在网页中插入一个层,然后把你想要定位的元素放在层里,接着我们就可以把层放到所想要任何位置了。此外,你还可以借助标尺和网格进行精确的定位。因为层只在最新的浏览器中被支持,所以为了兼容旧的浏览器,我们可以把层转变为表格。方法是选择“修改(Modify)→版面布局模式(Layout Mode) →把层转化成表格(convert layers to table)”即可。注意这时的层不能有重叠,我们可以在插入层之前选择“查看(view) →防止层交错(prevent layer overlaps)”来避免层的重叠。一般来说转换后的页面可能会有一些变化,还需要我们手工进行调整。最后有一点要注意,在进行表格和层的相互转换时,最好不要在一个页面中同时使用层与表格,那样可能会把你的页面弄得一团糟。

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

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

  25. 制作一个跟着页面走的图像                                      
  这一效果是通过JavaScript实现的。一般来说完成这样一个效果需要一定的编程能力,但现在我们可以通过Dreamweaver的插件轻易地实现。你可以到http://www.computerinfo.com.cn/classroom/chajian/chajian2.zip下载这个插件。插件的安装方法:解压缩后拷贝到Dreamweaver下的文件夹Configuration\Objects内的一个新建文件夹里面即可。重新启动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“)。
 
 -------------------------------------------------------------------------------------------------
 1. 用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 | 评论:2 | 引用:0
上一篇: Dreamweaver的超级技巧汇总(3)
下一篇:Dreamweaver的超级技巧汇总(1)

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

Comments

  • quote 2.张美工
  • 呵呵,我热爱的UE事业,同道为盟!只为知识分享!
  • 2009-5-25 9:32:33 回复
  • quote 1.
  • 谢谢,辛苦
  • 2009-5-24 10:41:18 回复

发表评论:

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

<#template:pagebar#>

最新文章

最新评论

Guest