《网站(网页)设计》实验指导书.doc

《网站（网页）设计》 编撰 闽江学院计算机实验教学中心印制目 录 实验一 HTML语言的认识与使用 1 实验二 使用HTML语言制作网页 4 实验三 Dreamweaver 8入门与应用 7 实验四 Dreamweaver 8强化训练 10 实验五 网站的发布与维护实验一 HTML语言的认识与使用 实验目的 （1）熟悉HTML的基本结构； （2）学会创建HTML文档； （3）熟练掌握HTML基本标志，包括文本、表格、图像、超级链接等标志； 实验环境 （1）1人1台计算机独立完成实验。 （2）安装了Windows 系列操作系统的计算机，并配有如下应用软件： · 记事本 · Internet Explorer 实验内容 1．使用记事本编写HTML代码，制作第一份网页。 步骤一：打开记事本创建文件(文件名E1.txt)。 步骤二：把如下代码写入E1.txt文件： HTML HEAD TITLE标题格式标记示例/TITLE /HEAD BODY center 这是一行普通文字P H1一级标题/H1 FONT face=宋体 color=#ee2233欢迎光临/FONTP U有下划线/U /center /BODY /HTML 步骤三：把E1.txt文件另存为E1.html. 步骤四：使用Internet Explorer浏览E1.html. （把实现的页面效果写入实验报告） 2．编写HTML代码实现如图1-1所示网页的设计： 图1-1 步骤一：遵循题1的步骤创建HTML文档（文件名E2.html）。 步骤二：使用ol标记制作有序列表，起始序列为3。 步骤三：使用ul标记制作无序列表。 （把实现的代码写入实验报告） 3．HTML综合实例设计 图1-2 综合实例 创建HTML文档（文件名E3.html），完成图1-2的页面效果的设计。 步骤一：制作一行两列表格，边框值border=3。 步骤二：添加文字“唐诗、七言乐府”字体为隶书、字号值5、加粗。 添加文字《金缕衣》，字体为华文新魏、字号值4。以及增加其他诗句。 步骤三：添加图片。并给图片做超级链接，链接地址为E2.html。 步骤四：制作左右滚动文字“唐诗欣赏（滚动字幕制作）”。 步骤五：插入水平线。 （把实现的代码写入实验报告） 思考题 （1）常用的列表标记有哪些？ （2）什么是文字滚动标记，该标记的属性有哪些？ 相关知识 INTERNET和WWW的知识，HTML相关知识。 实验二 使用HTML语言制作网页 实验目的 （1）熟悉HTML的基本结构； （2）熟练掌握HTML基本标志，包括文本、表格、图像、超级链接、表单等标志； （3）使用HTML制作内容丰富的网页。 实验环境 （1）1人1台计算机独立完成实验。 （2）安装了Windows 系列操作系统的计算机，并配有如下应用软件： · 记事本 · Internet Explorer 实验内容 1．编写如图2-1所示的表格HTML代码。 图2-1 2．编写HTML代码实现如图2-2所示网页的设计： 图2-2 步骤一：创建HTML文档（文件名E2.html）。 步骤二：使用body background=2-1.gif修改网页背景颜色。 步骤三：使用表格标志创建如图所示七行一列表格。 步骤四：添加相关文字与表单元素。 （把实现的代码写入实验报告） 3．HTML综合实例设计 图2-3 综合实例 步骤一：学习教材P95页例3-25中所应用的相关知识。 步骤二：创建HTML文档（文件名E3.html），完成图2-3的页面效果的设计。 回答如下问题： 插入图片使用什么标记，如何理解绝对路径和相对路径？ 超级链接a的属性有哪些，各是什么功能。 3）DIV是什么标记，如何使用？ （把问题的答案写入实验报告） 思考题 （1）常用的多媒体标记有哪些？ （2）什么是框架，框架的作用有哪些，与表格有什么区别？ （3）什么是CSS？它的实现方式有哪些？