Dreamweaver 3 网页设计技巧集锦
 
 
 
 



1 、如何把自己放在主页上的 zip 或其他文件让浏览者下载( down )?

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

2 、在网页中,图片和表格接触的地方如何不留空隙?

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

3 、有些网页的链接,原先没有下划线,你把鼠标指向链接处,才会出现下划线,鼠标移掉下划线就又没有了。如何实现这种效果呢?

可用层叠样式表( CSS )来实现的,在 Dreamweaver3 中编辑层叠样式表不用编写代码,具体操作方法如下:

1 )在快速启动栏中点击层叠样式表按钮(就是把鼠标放上去显示“ show css styles ”的那个按钮),在弹出的 CSS Styles 面板上双击( none );

2 )此时,可看到弹出的 Edit Style Sheet 面板,在该面板上按 New 按钮;

3 )再在弹出的 New Style 面板上点取 Redefine HTML Tag (重新定义 HTML 标记)再在 Tag 中选择“ a ”(超级链接标记)标记后按 OK 按钮;

4 )这时可看到弹出的 Style dehinition for a 的对话框,在此对话框中可以设置超级链接的许多属性,你可以按你的意愿设置,但我们这里主要是要去掉那讨厌的下划线,所以我们在 decoration 属性中选择“ none ”,这样就把下划线去掉了;然后我们再选择颜色为: #339966 。按OK按钮返回到 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 按钮,至此所有设置结束,你在 Dreamweaver3 的源代码检视窗中将看到在与之间如下所示的代码:


有了这段代码,你在该网页上的所有文字链接在浏览器中显示时没有下划线,当你把鼠标指向链接处,才会出现下划线,鼠标移掉下划线就又没有了。若你想在其它网页中也具有这种效果,你可以用上述方法设置或更简单点,直接把这段代码复制,粘贴到与之间即可。注意:若不是在 a 中定义除去下划线而是在 a: link 中定义除去下划线,在实际使用时不能除去下划线,我是在 IE4.0 环境下测试的。

It is very simple to do this by using Dreamwaver MX.

Windows/CSS/a:hover(right click)/edit/select underline/OK

Another simple way: go to page property/link/ 仅在图象变换时显示下画线

4 、在 dreamweaver3 中,超级链接可以实现许多网页特效( Behaviors ),但有时我们只想使用 Behaviors 功能,而又不链接到任何地方去,怎能么办?

选取要作为超级链接的元素(一幅图片或一段文字),在属性面板上的地址栏( Link )中不填写任何链接地址,只加上一个“ # ”号,(引号不包括在内)。这样即可以 Behaviors 功能,而又不链接到任何地方去了。

5 、在同一网页中如何点一个链接使得窗口移到本页指定的地方,就象 SOIM 一份杂志《英文天地》一样?

这就应用所谓的“书签”功能。在 dreamweaver3 中,“书签”不是用“ BookMark ”表示,而是用“ Name Anchor ”(一般直译为“锚”)。在需要转到的地方同时按下“ Ctrl+Alt+A ”键,在弹出的插入“书签”对话框 (Insert Name Anchor) 中,输入一个书签的名字,名字你可随便取,若有多个书签,只要不重名就行了。然后在要作超级链接的元素属性面板上,点击地址栏的下拉框,你可看到你所插入的书签名全在这里,只是在最前面加了一个“ # ”号,你选取一个你欲链接到的地方的书签名册名就行了。


6 、如何在网页中制作以下东东:在总目录的前方有一个“ +" ,一按这个“ +" ,即可显示其下子目录,“ +" 即变成“ -" ,一按“ -" ,即可隐藏其下子目录,就象在资源管理器中那样?

这需要做二个页面,一个页面写上总目录,一个页面写上子目录。把总目录的页面上的 "+" 号设置成超级链接,在“ Link ”栏中添上子目录页面的地址。把子目录的页面上的 "-" 号设置成超级链接,在“ Link ”栏中添上总目录页面的地址。具体效果可看一看 Dreamweaver3 的帮助文档,在这帮助文档里也是按一下总目录,弹出子目录,按下子目录上的总目录则返回到总目录,只是没用“ + ”、“ - ”表示而已。你再看一下该文档的源代码就一目了然了。

7 、在 Dreamweaver3 中怎样设置行间距?

用层叠样式表( CSS )来实现,在 Dreamweaver3 中编辑层叠样式表不用编   
写代码,具体操作方法如下:

1 )在快速启动栏中点击层叠样式表按钮(就是把鼠标放上去显示“ show css styles ”的那个按钮),在弹出的 CSS Styles 面板上双击( none );

2 )此时,可看到弹出的 Edit Style Sheet 面板,在该面板上按 New 按钮;

3 )再在弹出的 New Style 面板上点取 Redefine HTML Tag (重新定义 HTML 标记)再在 Tag 中选择“ body ”标记后按 OK 按钮;

4 )这时可看到弹出的 Style dehinition for body 的对话框,在此对话框中可以设置“ body ”标记的许多属性,你可以按你的意愿设置,但我们这里主要是要行距,所以我们在 line 属性输入框中填上行距的像素点数,现在流行的九号字,行距一般用 12 ,按OK按钮返回到 Edit Style Sheet 面板,此时已把“ body ”的行距设置好了;

5 )由于“ body ”中定义的行距对表格不起作用,所以我们再在 Edit Style Sheet 面板上再按 New 按钮;

6 )再在弹出的 New Style 面板上点取 Redefine HTML Tag (重新定义 HTML 标记)再在 Tag 中选择“ td ”标记后按 OK 按钮;

7 )在弹出的 Style dehinition for td 的对话框中设置 td 的行距,按OK按钮返回到 Edit Style Sheet 面板;

8 )在 Edit Style Sheet 面板上再按D on 按钮,至此所有设置结束,你在 Dreamweaver3 的源代码检视窗中将看到在与之间如下所示的代码:


有了这段代码,你在该网页上的所有文本的行距都确定好了,若不满意,可修改设置。若你想在其它网页中也具有同行的行距,你可以用上述方法设置或更简单点,直接把这段代码复制,粘贴到与之间即可。

8 、有的提供网站空间的 ICP 要求首页默认名为 index.html ,用 Dreamweaver3 制作的网页扩展名都是 htm ,怎么办?

在 windows 下直接把扩展名改为 html 就行了,对内容不影响,而且仍然可用 Dreamweaver3 编辑修改。

9 、有的浏览者喜欢把浏览器设置成大字体,在访问我的网页时,把网页弄得面目全非,怎么办?怎样设计才能使浏览者在浏览时对网页字体大小的设置不起作用?

用 CSS 层叠样式表对字体进行强制性控制(像素)。关于在 Dreamweaver3 中如何定 CSS ,请参看上面的第 7 条。

10 、为什么用 dreamweaver3 插入动画图片,保存网页后,然后再打网页浏览,图片却不动?

看一下你的浏览器设置中是否把“播放动画”给禁止了。若是 IE 浏览器,这样检查:在浏览器主菜单上选“查看” -->Internet 选项 --> 高级,在“高级”选项对话框中,找到“多媒体”项下的“播放动画”,把该项选上就行了。

11 、作一个网页让它每过五分钟刷新一次,怎么才能达到这个效果?

在 Dreamweaver3 的功能面板上选择“ head ”功能组面板,在这面板上点击“ Refresh ”功能图标,在弹出的“ Insert refresh ”对话框中,在“ Delay ”中输入要刷新的间隔时间,以秒计,例:隔五分钟刷新一次,则输入 300 即可。再在该对话框上选择“ Refresh This Document ” ( 刷新当前窗口 ) ,按 OK ,大功告成。当你再次浏览该网页时,它将自动地隔五分钟刷新一次。

12 、用 dreamweaver3 制作的网页,在自己机上用 IE 预览正常的链接,上传到网站都不见了。怎么办?

把网页的所有文件名统一成小写(或大写),再上传就行了。因为很多服务器使用的是 UNIX 操作系统,它对大小写是很敏感的,也就是说大写的文件名和小写文件名它认为是两个文件,你在上传时必须注意大小写。另外要注意:超级链接要使用相对路径,不要用绝对路径,也不要用中文文件名。

13. 在 Dreamweaver 中自动设置网页的水平线颜色

水平线对于制作网页的朋友来说一定不会陌生,它在网页的版式设计中是非常有作用的,可以用来分隔文本和对象。在 Dreamweaver 中依次点击 “ 插入 → 标准 ” ,然后单击 “ 水平线 ” 按钮即可添加一条水平线。 Html 代码为〈 hr 〉。

  在网页设计过程中,如果随意利用缺省水平线,常常会出现插入的水平线与整个网页颜色不协调的情况。打开水平线属性面板也只有宽、高、对齐以及阴影方面的设置,没有对水平线颜色的设置,怎么办 ?   其实,你只要仔细看一下水平线的属性设置面板,就会发现一个 “ 快速标签编辑器 ” ,点击此标签并在后面输入 “color= 颜色 ” 。这里的 “ 颜色 ” 可以是任何颜色,一般格式为:
〈 hr color=#FF0000 〉。

  用这个方法设置后,在 Dreamweaver 中无法直接看到效果,我们可以点击 “F12” 键,在浏览器里浏览水平线的颜色变化。

  

小技巧:诸如 “#FF0000” 这样的颜色代码对于初级朋友来说不容易分辩,你可以这样做:给网页中的字体加上颜色  此颜色是你想给水平线所要加的颜色  ,然后把颜色代码复制并粘贴到水平线的 “ 快速标签编辑器 ” 即可。

  

14. Dreamweaver 小技巧:超高速下载图像

  

有时在浏览网页时,常常因为网页中的图片文件过大而使下载时间较长,这样还没有下载完,就会有许多浏览者不耐烦地拂袖而去,从而损失了客户流。但要使图片文件变小,可能又要以牺牲图片质量为代价,这样势必使网页吸引力下降,同样不能使网页制作人员满意。

  怎样才能做到既有精美的图片,又不使下载时间过长呢?这可以通过调用 Dreamweaver 中的 Preload Images 动作来实现,它可以把尺寸较大的图片预先载入到浏览器的高速缓冲存储器文件中,这可以防止下载图片延时。下面结合实例来介绍给朋友们:

1. 运行 Dreamweaver 应用程序,并导入一张图片。

2. 选中图片,单击行为标签,在此面板中,点击 “ 增加事件 ” 按钮,出现下拉菜单,如图 1 所示。

3. 在菜单中单击 “ 预先载入图像 ” 命令,在出现的对话框中,单击浏览按钮,选择刚载入的图片文件,然后单击 “ 确定 ” 。

   这样就设置好了欲下载的图片,在浏览器中下载此图片时就会大大提高速度了。