《网页设计与制作基础》实验指导书(2010-2011-2)
-
实验一
网页的认识
实验目的
1
、
掌握利
用
Internet
进行信息游览、搜索，下载网页、图片、文
字和文件；
2
、
利用记
事本来编辑
HTML
文档并浏览。
实验环境
WindowsXP
操作系统，内部组成局域网，外连
Internet
< br>互联网。
实验重点及难点
熟悉使用浏览器进行浏览、搜索、下载。
熟悉
HT
ML
的结构、语法。
实验内容
1
、
浏览新
浪主页并保存，观察其保存结果（其中包括哪些文件和文件夹）
。
2
、
从
网上（如网页制作大宝库
等）下载网页制作时需要的小图片、动
画及
flash
等网页
制作素材。
3
、
收集你认为比较好的网页并从网页主题、网页内容、结构布局、色彩搭配等方面来分析网页。
4
、
通过浏览百度分析其网页基本元素，查看其源代码，收藏到收藏夹中，将其设为主页。
5
、
制作一个简单的网页
，用记事本编辑，网页标题为“我
的第一个网页”
，内容为司空曙的《江村即
事》
，如下图所示。
实验二
网页的基本元素（一）
实验目的
1
、
掌握文
本段落格式标记，包括注释标记，分段标记，换行
/
不换行标记
，标题标记，分节
标记，水平线标记，文本居中标记等；
2
、
掌握文
字显示效果标记，包括字体标记，字符样式标记以及转义字符等；
3
、
掌握列表格式标记，包括无序列表标记，有序列表标记等；
4
、
掌握超
链接的使用，包括锚点标记、页面跳转链接、书签超链接、下载文件链接以及电
子邮件链
接等；
5
、
掌握图片标记，包括插入图片标记，图片超链接标记网页背景标记；
6
、
掌握音频和视频标记，包括链接音频或视频文件、设置网页背景音乐标记，内嵌音频或
视
频播放插件等；
7
、
掌握动态元素标记。
实验环境
WindowsXP
操作系统，内部组成局域网，外连
Internet
< br>互联网。
实验重点及难点
熟练掌握各种常用标记并利用其来实现网页的排版。
实验内容
1
、
通过记
事本编辑网页
，实现如下页面：
2
、
通过记事本编辑网页
，实现如下页面：
3
、
通过记
事本对网页
按要求进行编辑并另存为
<
/p>
，效果如图所示。
标题文字大小用
标记；
作者信息文字大小为
4
，字体为幼圆，颜色为红色；
古诗文字大小为
4
，字体为隶书，颜色为蓝色；
在作者信息后加一条水平线，居中，水平线宽度为浏览器的
50%
，水平线的粗细
为
20
个像素，颜色为棕色；
4
、
通过记
事本对网页
按要求进行编辑并另存为
<
/p>
，效果如图所示。
插入背景图片背景
.jpg
在古诗左下方插入作者的照片司空曙
.jpg
为网页添加背景音乐江村即事
.mp3
5
、
通过记
事本对网页
按要求进行编辑并另存为
<
/p>
，效果如图所示。
给标题设置超链接，链接到网页江村即事
_
百度百科
.htm
；
给图片设置超链接，链接到网页司空曙
_
百度百科
.htm
。
实验三
网页的基本元素（二）
实验目的
1
、
掌握使用表格标记来创建和设置表格；
2
、
熟悉表
单标记并掌握利用这些标记来创建表单以及其中的各种表单域。
实验环境
WindowsXP
操作系统，内部组成局域网，外连
Internet
< br>互联网。
实验重点及难点
不规则表格的创建。
使用表格来布局表单。
实验内容
1
、
用记事
本编辑制作一个网页
，效果如图所示。
2
、
用记事本编辑网页
，实现如下页面。
3
、
用记事本编辑网页
，实现如下页面。
4
、
用记事
本编辑网页
，实现如下页面。
5
、
对
进行适当的修改并另存为
< br>，实现如下页面。
实验四
Dreamweaver
基本操作
实验目的
1
、
熟悉<
/p>
Dreamweaver
的工作环境并了解本地站点的建设和管理
；
2
、
熟悉网页文件的基本操作；
3
、
熟练掌
握在网页文件中各种网页基本元素（文本、图像、超链接、多媒体对象、表格以
及表单等
）的添加和设置。
实验环境
WindowsXP
操作系统，
Dreamw
eaver
软件，内部组成局域网，外连
Internet
互联网。
实验重点及难点
各种超链接的创建。
背景音乐的添加。
实验内容
1
、
使用<
/p>
Dreamweaver
建立一个本地站点，
放在磁盘的最后一个盘符里并命名为
“我的第一
个网站”<
/p>
，包含以下几个文件和文件夹：
；图片文
件夹（
images
）
；音乐文件夹<
/p>
（
sound
）等，把
< br>
设定为网站首页。
2
、
在站点
“我的第一个网站”中新建一个名为“我的心情”的网页文件，从提供的网页原
始素材<
/p>
“人生最美是淡然
.doc
”
中把文字复制到该网页文件中，
并进行适当的文字设置，
< br>结果如下图所示。
3
、
在网页文件“我的心情”中设置背景音乐“安妮的仙境
.mp3
”
，并为该网页加上背景颜
色，在其标题后
插入一幅图片“淡然
.jpg
”
，为标
题中“淡然”两字加上超链接，使其链
接到“淡然
_
百度百科
.htm
”中，效果如下图所示。
4
、
在站点
“我的第一个网站”中新建一个名为“我的音乐”的网页文件，在该网页文件中
建立一个
如图所示的表格，并在表格下方添加文字“同时让我们回去童年快乐时光吧！
”
和插入
Flash
影片“拔萝卜”
。
5
、
在站点“我的第一个网站”中新建一个名为“留言簿”的网页文件，在该网页文件中建
立一个如图所示的表单。