|
Dreamweaver与Firework、Flash 并称为网页三剑客，由于均是Macromedia公司的产品，因而在功能上有着一个非常紧密的结合，因此说Dreamweaver是高级网页制作的首选并不为过。Dreamweaver是Macromedia公司出品的一款"所见即所得"的网页编辑工具，与 Frontpage不同，Deamweaver采用的是Mac机浮动面版的设计风格，对于初学者来说可能会感到不适应。下面给出一实例，期望对大家有所帮助。
实验一 巧妙使用Dreamweaver表格
一、实验目的
1.熟练掌握如何创建一个表格。
2.熟练应用表格各个方面的属性。
3.学会巧妙使用。
二、实验设备
1.硬件：586以上主机，最少64M内存，16G硬盘。
2.软件：中文Windows98及其以上版本的操作系统和Macromedia公司Dreamweaver4.0应用程序。
三、预习要求
1.认真阅读教材中关于表格的内容。
2.试建几个简单的表格。
四、实验步骤
（一）利用表格使信息整齐、美观
1.单击“插入/表格”或在控制面板中直接单击“插入表格图像”，制作1行5列，宽度为100%，边框大小设为0(border=0)，间距设为1(cellspacing=“1”)，背景色设为浅色（如Bgcolor=“＃FFFFFF”），边框色也设为浅色bordecolor=“#FFFFFF”全部选定单元格，并将单元格的背景色设为浅色如（Bgcolor=“#9966cc”），边框色不变，表格见图1-1所示：
图1-1
2.分别在5列中输入文字:如“梦想”、“欢乐”、“新闻”、“艺术”、“音乐”，并分别设置字体，其效果见图1-2。
图1-2
3.按F12预览一下效果。
（二）利用表格制作凹凸效果
1.单击“插入/表格”，制作2行2列，其参数设置如下：
边框大小设为1，间距设为2，CELLPADDING设为0，背景色设为“9999CC”，宽度设为50%，边框颜色设为系统默认的颜色。
2.按F12预览一下。
注：这当中有一个技巧：把边框颜色设为浅色一点，表格就会凹凸起来了。
实验二 实现网页每5分钟自动刷新一次
一、实验目的
通过实验掌握功能面板中关于头文件的用法
二、预习要求
1.了解头文件的概念及应用。
2.熟悉教材中关于这方面的内容。
三、实验步骤
1.新建一文件在Dreamweaver的功能面板上选择“文件头（head）”功能组面板，在这面板上点击“刷新（Refresh）”功能图标，如图2-1所示：
图2-1
2.在弹出的“插入刷新（Insert refresh）”对话框中，在“延迟（Delay）”中输入要刷新的间隔时间以秒计，例：隔五分钟刷新一次，则输入300即可。
再在动作栏中选择“刷新当前窗口（Refresh This Document）”，如图2-2所示：
图2-2
3.按确定后即可，当你再次浏览该网页时，它将自动地隔五分钟刷新一次。
实验三 制作电子邮件表单
一、实验目的
1.熟悉DreamWeaver中表单的使用。
2.掌握如何创建动态交互式表单。
二、预习要求
1.认真阅读教材中有关表单的内容。
2.熟悉表单对像及其用法。
3.认真做完这一章的实例。
三、实验步骤
1.插入表单，用“插入（Insert）/表单（Form）”命令或选择对象面板（Objects）/表单（Forms）/插入表单（黄色显示方框），此时将弹出一个红色虚框，这就是表单的外围，在下面讲到的表单元素必须位于红色的虚线框里才起作用。为了表单中的元素定位方便，再插入一个表格，至于表格的大小可自行控制，图中的表格是5行×2列的。然后把第5行合并单元格。
2.分别将您的姓名、邮件地址、主页地址、您的建议输入到1行1列、1行2列、1行3列、1行4列表格中。
3.插入表单元素，在“您的姓名”边上的单元格中插入一个文本框，用“插入（Insert）/表单对象（FormObject）/文本域（TextField）”命令或在面板上选择图标。
同样在下面的“邮件地址”、“主页地址”和“您的建议”边上的单元格中也分别插入一个文本框。选中一个文本框，参数的具体含义如下所示：
“文本域（TextField）”：文本框的名字，对于本例，可分别取名如“姓名”、“邮件地址”、“主页地址”和“意见”。
“字符宽度（CharWidth）”：文本框显示在网页上的长度，本例分别为10、25、25、28。
“最大字符数（MaxChars）”：最多能输入的字符长度，本例中省略。
“类型（Type）”：共有三类，“Singleline”表示单行文本，“Multiline”表示多行文本，“Password”表示密码框，本例中仅有“您的建议”这一栏是多行文本以外，其余均是单行文本。
但属性面板会有所变化，与前面的面板相对比，“字符宽度”被“行数（NumLines）”代替，“换行（wrap）”也从灰色不可用变为可用它是多行文本的外观参数，如图3-1所示。
图3-1
“InitVal”：文本框中的初始值，此例中省略。
4.在第5行的单元格里再插入一个边框Border=0，宽度为100%的1行×2列的表格（用表格可以很方便地控制元素的位置），然后在1行1列中插入发送按钮，使用“插入/表单对象/按钮（Button）”命令或选择对像面板中的按钮图标（蓝色显示），此时属性面板变成如图3-2。
图3-2
5.在1行2列中插入清除按钮，其属性设置见图3-3。
图3-3
6.这是最关键的一步，单击表单周围的红色虚框。图中“表单名称”设为yj;“动作”表示表单提交后将由哪个程序来处理，这儿填入你的E-MAIL地址，提交“方法”，有“Post”和“Get”两种，默认为Post如图3-4。
图3-4
7.单击屏幕空白处，可见整体效果如图3-5所示，按F12预览一下，可以输入相关信息试一下效果。
图3-5
实验四 制作浮动提示
一、实验目的
1.了解表格、超链接、文字的设定。
2.了解如何创建图层及图层的基本操作。
3.深刻理解什么是行为及重要作用。
二、预习要求
1.认真阅读教材中有关表格、超链接、文本及行为的内容。
2.学会使用行为面板中的所有功能。
三、实验步骤
1.首先插入一个两行四列的表格，第二行的四个单元格合并起来，边框设为0，并在第一行的各个单元格中填写相应的文字，选中文字在其属性栏内加上相应的链接，分别为各自的网址（如“中计函院”对应的超链接为http://www.cccc.net.cn），依次类推。第二行的单元格插上一个图层（命名为：happy），如图4-1所示：
图4-1
2.选取“中计函院”二个字，按Shift+F3，打开行为面板，点击行为面板上的
，选取设置文字，再选设置图层文字，如图4-2所示：
图4-2
3.然后出现对话框如图4-3所示（在新的HTML里填上需要的文字），然后按确定：
图4-3
4.再点击一次 重复刚才的步骤，不过这次新的HTML里不写任何文字，然后按确定。行为面板变成如图4-4所示：
图4-4
5.把第二次加进的行为onMouseover改为onMouseout。
注：若点击onMouseover旁边的 ，找到onMouseout后选中它，如果找不到,选显示事件，再选其它版本浏览器，这样就有onMouseout了。行为面板变成如图4-5所示：
图4-5
6.再选取新浪两个字，操作和上面的步骤一样，只不过加入的文字不同。
7.再选取雅虎两个字，操作同理。
8.再选取网易两个字，操件同理。
9.把网页保存下来，按F12即可看你做的效果。
实验五 利用Dreamweaver4.0新增功能制作闪动按钮、流动文字
一、实验目的
1.通过实验完全掌握Dreamweaver4.0新增的Flash功能。
2.比较 Dreamweaver3.0与Dreamweaver4.0的区别。
二、预习要求
1.了解Dreamweaver4.0中新增了哪些功能。
2.认真阅读教材中有关新增Flash功能的用法。
三、实验步骤
（一）让按钮有闪动效果
1.选择 “插入/交互式图像/Flash按钮”就可看到有哪些内建按钮。在对话框内甚至可以用鼠标指到想要使用的按钮形式，依次输入参数，例如：选用“Blue Warper”按钮，按钮文本栏中输入“梦的故乡”，字体设为“楷体_GB2312”、大小为“14”，链接栏输入“http://www.cccc.net.cn”，如图5-1所示：
图5-1
注:插入Flash按钮、Flash文本时当前网页一定要预先保存。
2.按下确定后，会有一个 SWF文件产生，其档案会自动置入你的网页中，按一下这个做好的档案，会看到 Property Inspector （属性明细）中其档案的属性。打开扩展档案属性明细表，会出现 Play （播放）钮，如图5-2所示：
图5-2
3.按确定之后，不用开启浏览器来预览按钮的闪动效果。如图5-3所示：
图5-3
（二）制作流动文字
1.选择“插入/交互式图像/Flash文本”会弹出一对话框，在文本栏内输入文字如“心贴心服务，手把手教学”设定文字的字体、大小、颜色以及转滚颜色等，如图5-4所示：
图5-4
2.按下确定后，点击其属性按钮中的Play，浏览一下即可看到其效果。
| 
