（1）插入文本
在Dreamweaver中，对文本的输入及编辑，与word极其相似。打开新建或已经建立的页面，把光标放在编辑区中，就可以输入文字/特殊的字符了。
（2）添加中文字体或中文组合字体到字体列表（两种步骤不同）
下面为中文字体的添加步骤：
在属性面板中，单击“大小”左侧的∇图标，选择编辑字体列表,就可看到图3-13的对话框。
在窗口中选择需要插入的图片。如果选择的图片文件在网站目录以外，系统会询问是否将图片复制到网站内，此时应该选择“是”。
将选择好的图片存放在网站内的特定位置。
保存完毕，就可以看到插入的图片效果了，并且可以通过图片属性面板来改变图片的属性。
（2）编辑图像
利用图像属性面板，设置图像的各种属性。
11．创建超链接（以文字为例）
■设置好之后，选择【应用】【确定】即可。
图3-11页面属性设置窗口
（3）网页的创建、保存与打开。
选择【文件】→【新建】，打开如图4-2所示的对话框，就可新建各种类型的网页，此时新建页面的文件名默认为“Untitled-1.htm”，点击保存图标，即可进行保存更改文件名的操作。
图3-12新建文档窗口
9．文本的插入和编辑
（1）插入表格
（2）修改表格样式
（3）填充内容写并对各个网页创建超能链接。如:“”
图4-1表格网页
注：实验报告中要求写出详细步骤。
2．使用框架布局网页
在网页中利用框架布局一般经过如下步骤：
（1）创建框架
（2）设置框架属性
（3）设定初始页面
（4）确定框架间的调用关系
图3-3图3-4
单击【下一步】,弹出图3-4，指定网站所在的本地端文件夹位置单击 按钮，选择E：\shiyan\
单击【下一步】,弹出图3-5，在如何运用服务器技术中选择【无】
单击【下一步】,弹出图3-6，完成。
图3-5图3-6
（3）按照上面的说明设置完成后，此时会弹出文件面板组，显示出如图3-7所示的本地的站点视图。
2、制作一个如图2-2样式所示的个人网站首页，要求点击左边各目录项，相应的链接会显示在右下的帧中，并且适当填加特效如：背景图片、图像、动画等。
图2-1个人网站首页
三、实验步骤
1．打开任何一种文本编辑工具，可以是附件中的记事本，也可以是FrontPage/Dreamweaver的代码窗口。
2．按各种不同标签的语法规则，输入合法的代码。
网页设计
实验指导书
经济与管理学院
二零一一年二月
实验一网页设计基础实验
一、实验目的和要求
1、了解网站的相关知识，IP地址、域名、主页空间等。
二、实验内容和步骤
1．IP地址的申请
（1）了解IPV4地址申请步骤
（2）查询学校主页的IP地址信息202.119.136.0
（3）/index/0D/index.htm
查询到学校的IP地址段范围、单位、通信地址、联系人等信息
2、域名信息查询
（1）/index/0A/index.htm
查询到相关的域名状态、域名联系人、注册日期等相关信息。
3、域名注册
（1）/
三、实验报告要求
按“实验内容和步骤”完成1～4的网上操作，在实验报告中要求记录如下内容：
二、实验内容
1．动作动画的制作
完成第一个FLASH影片：在黄色背景的屏幕中间，由小到大逐渐扩展显示蓝色文字“第一个FLASH影片”，同时从右向左展开一幅云图图像，一个红色立体球由左上方缓慢移到屏幕中间的下边，移动的同时球由小变大。
基本步骤：
(1) 新建一个影片文件和设置影片的基本属性；
(2) 输入文字“第1个FLASH影片”，设置文字的属性；
从可用字体框中，选择要添加的字体，单击“《“，这种字体就会添加到选择的字体框中了。
单击ok按钮，就可以将这种字体，添加到字体列表中了。
图3-13编辑字体列表框图3-14选择图像源窗口
（3）设置文本格式
可以通过属性面板，包括段落的格式、字体、字号、字的颜色等等，将“单词识记”设置“标题2”其于文字设置成列表格式。
（2）启动ODBC，在ODBC窗口中选择“系统DSM”；
（3）单击“添加”，在“创建新数据源”对话框中选择“Microsoft Access Driver(*.mdb)”驱动；
（4）单击“完成”，在出现的“ODBC Microsoft Access安装”对话框中输入数据源名及说明，并选择要进行链接的数据源；
（4）单击进入“普通”选项卡，返回网页编辑状态，单击“保存”按钮保存设置。
（5）关闭网页。
6．在网页中插入多媒体对象
注：在网页中插入多媒体对象的基本方法为：“插入”/“媒体”/“插件”
三、实验心得体会
实验四网页布局（4课时）
一、实验目的和要求
1．掌握在Dreamweaver8中使用表格布局网页的操作；
（5）单击“确定”即可建立DSN。
8．熟悉Dreamweaver 8的基本工作环境
（1）打开Dreamweaver 8，自行熟悉各菜单、面板等的使用。
（2）设置网页背景属性。
■点击主菜单上的【修改】【页面属性】,弹出图4-1所示的对话框。
■在对话框中可以设置背景标题、背景图像、文本颜色以及各种链接的颜色等等。
3．输入完成后保存代码文件，文件后缀为.htm/.html。
4．在IE浏览器中打开保存的文件，看看是否能完成自己想要的设置。
四、程序代码（在实验报告中写出）
五、实验心得体会
主要包括在实验过程中学到了哪些东西；遇到了哪些困难，又是如何解决的；还有什么问题没有解决，分析其原因。
实验三本地站点的创建和编辑
2．掌握在Dreamweaver8中使用框架布局网页的操作；
3．掌握在Dreamweaver8中使用层布局网页的操作。
二、实验内容和步骤
1．使用表格布局网页
表格是将页面中的内容以表格的形式排列，常用于单一页面内图片与文字的安排，是最常用的布局命令。
在网页中利用表格完成如图4-1所示的网页,一般经过如下步骤：
(5)保存框架文件
（6） 建立“简介”“基本元素”“超链接”等页面显示在主框架中。
完成如图4-2所示的网页,并依据一般步骤写出详细步骤，图像可自行选择。
图4-2 框架网页
3．使用层布局网页
建立如图所示的页面
（1）利用菜单“插入”/“布局对象”/“层”或利用插入栏中的常用面板来实现插入图；
（2）从属性面板中设置图层的基本属性
（2）设置超链接属性
选择“文件/属性”命令，打开“网页属性”对话框，单击进入“背景”选项卡。
单击“启动超链接翻转效果”复选框，单击“翻转样式”按钮，打开“字体”对话框，设置鼠标光标指向超链接时显示出的效果。
在“超链接”、“已访问的超链接”和“当前超链接”的颜色列表框中，选择要使用的颜色。
（3）单击进入“预览”选项卡，预览网页，在主页中单击超链接文字，察看链接到的网页。
（1）可以采用以下的任一种方法
在网页中选中要建立超链接的文字，选择文件“插入/超链接”命令，在超链接对话框中选择页面作为超链接的URL。
在网页中选中要建立超链接的文字，单击鼠标右键，在弹出的快捷菜单中选择“超链接”命令，在超链接对话框中选择页面作为超链接的URL。
选中超链接文本后，在常用工具栏中单击超链接按钮图标都可以打开对话框。
在文档编辑区将插入点定位到所需位置，选择[插入][HTML][水平线]菜单命令或单击“插入”栏中的“HTML”选项卡在其中单击 按钮即可添加水平线。（如图3-15）
图3-15水平线的属性面板
②插入日期
插入面板中【常用】→【日期】，图3-16；
图3-16插入日期
10．添加图像
（1）添加图像
将光标想要插入图片的位置，点击主菜单上的【插入】【图像】这时出现选择图像源的对话框窗口。
1．定义本地站点
（1）单击【站点】【新建站点】命令，打开图3-1所示的站点定义窗口。
图3-1图3-2
（2）选择“基本”选项卡，在分类列表中选择本地信息选项开始定义站点。
■各选项的设置方法可参考下面的文字说明。
站点名称文本框：输入网站中文名称，如：风行科技(如图3-2)；
单击【下一步】,弹出图3-3，选择【否，不想使用服务器技术】
（3）将“untitled.htm”的网页文件更名为“index.htm”,回车。
3．修改、删除文件名。
直接选中要修改的文件，单击即可修改，或右击并从快捷菜单选择【重命名】。
直接选中要删除的文件，按delete键，或右击并从快捷菜单选择【删除】。
图3-9建立网页文件图3-10站点编辑窗口
6．编辑网站内容
单词识记
英文单词Do的含义:
做，干；
制作，产生；
算出，研究；
行，合适；
Do away with 废掉
Do without 没有┄┄┄也行
Have nothing to do with 和 ┄┄┄┄毫无关系
Have(something) to do with 和 ┄┄┄有点关系
（4）插入其他文本
①插入水平线
1．IP地址的申请步骤，及查询学校的I地址得到的信息；2．查询任一域名地址，记录相关信息；
3．写出域名地址的申请步骤；
4．浏览所列出的几种类型的风站，说明这些网站所包含的主要信息。
四、实验心得体会
主要包括在实验过程中学到了哪些东西；遇到了哪些困难，又是如何解决的；还有什么问题没有解决，分析其原因。
（1）在定义了一个或多个本地端的站点之后，往往由于某种原因需要编辑网站的相关数据，这时打开图3-10编辑站点窗口，再按照下面的步骤操作。
（2）选择要修改的网站，完成修改网站的相关设置，完成后单击ok。
（3）回到编辑站点对话框，单击完成按钮结束工作。