文档介绍：第六章 Dreamweaver网页设计技术
Dreamweaver是一套视觉化的网页开
发工具,利用它可以轻而易举地制作出跨
越平台和浏览器限制的充满动感的网页。
通过Dreamweaver 提供的“所见即得”
的友好编辑功能,编写ASP、JSP、CFML
甚至PHP程序,从而创建动态网站系统。
教学重点与难点
页面版面设计
使用资源面板
创建模板
Dreamweaver 简介
一、操作界面
Dreamweaver 4由两个部分组成,即
页面编辑器和站点管理器。
分为五个部分:菜单栏、工具栏、控制
面板、文件工作区、状态栏。其中控制面
板有属性面板、对象面板、样式面板、帮
助面板等。
站点管理器左侧窗口显示了站点地图,
右侧窗口显示了当前网站中的文件列表。
一般来说,在做站点时应先建立好站点,
再开始网页的制作,这样可以保证页面内
文件链接的正确性。
Dreamweaver 制作基础
一、创建网页
启动Dreamweaver 4,就会自动生成
一个白色背景的文件工作区,这里就是设
计和制作网页的地方,可以在这里输入网
页设计过程中所需要的文字、图片、表格、
Flash动画等。
网页的背景颜色的,以及文字的颜色都
是可以通过“Page Properties”设置的。
二、文字的编辑
可以直接在网页中输入文字,可以在
【Text】下设置文字的格式,如字体、字
号、颜色、粗体、斜体,段落居左、居中
及居右,添加项目符号及编号等。此外,
还可以利用HTML样式和CSS样式对文字进
行统一格式设置。
可以利用属性面板更改文字的大小、颜
色、字体等。
三、插入图像
在网页中插入一幅图片时,图片文件必
须位于当前站点中。
在对象面板中选择插入图片图标,此时
系统将打开“选择图像源文件”对话框。找
到需要插入的图片文件,选择“Select”。
Dreamwaver支持常用的网页图片格式有
扩展名为“GIF”、“JPG”、“JPEG”、“PNG”
的图形文件。
四、插入鼠标变换图片
该图片对象的特点是当鼠标经过该图片
时,图片内容会自动更新。实际上,它是
由两幅图片组成的,一幅为主图片,显示
在页面中;一幅为滚动图片,当鼠标经过
图片所在区域时显示。单击对象面板中的
图标,或者选择【Insert】菜单的
“Interactive Images”子菜单中的“Rollover
Image”命令可实现该操作。
五、创建图片热点
在插入的图片上,可以是交换式图片,
可以把图片分为若干个区域,每个区被称
为“热点”,可以为每个热点指定相关的链
接。当单击某个热点时,系统显示相关的
网页。当绘制完热区后,属性面板会显示
热区的属性。
还可以调整热点区尺寸。
六、插入水平线
在对象面板中选择按钮,在页面中点击,
画面会自动生成一条水平线,在水平线上
单击,可以设置水平线的宽度、高度、对
齐方式、是否有阴影等参数。
七、插入邮件链接
创建邮件链接的作用是当浏览者点击该
链接时,系统将自动启动计算机中的邮件
发送程序。