网页制作与网站设计实验报告

实验学时：    2

实验日期：2012年3月8日

实验要求：

    1、掌握HTML中超链接的原理和应用方法，对同一个网页内部的链接、不同网页之间的链接、文字链接、图像链接的用法进行验证。

    2、主控网页，通过超链接可以进入其它网页；不同网页之间可以通过文字或图片链接相互跳转。

实验内容：

答：1、超链接的概念及类型。

超链接是指从一个网页指向一个目标的连接关系,这个目标可以是另一个网页,也可以是相同网页上的不同位置，还可以是一个图片，一个电子邮件地址，一个文件，甚至是一个应用程序。而在一个网页中用来超链接的对象，可以是一段文本或者是一个图片。超链接在本质上属于一个网页的一部分，它是一种允许我们同其他网页或站点之间进行连接的元素。

2、超链接的创建。

HTML代码如下：

 超链接的运用

 戚薇相关资料

 百度图片

 戚薇个人资料

 图\新建文件夹\戚

网页效果如下：

实验学时：    2

实验日期：2012年3月15日

实验要求：

掌握HTML与表格样式相关的功能设置：表格单元格背景颜色背景图像设置、跨行跨列合并等设置。

实验内容：

答：HTML代码如下：

     

     第二次作业

       上学期

网页效果如下：

实验学时：    2

实验日期：2012年3月22日

实验要求：

1、掌握HTML表单的作用及网页中表单域和表单元素的用法。

2、能够应用表格来对表单元素进行布局。

实验内容：

答：HTML代码如下：

 表单的应用

 个人信息登记表

 姓名：

 性别：男

 女

 登录密码：

 个人简介：

 请在这儿输入个人基本情况。

 提交">

 重置">

网页效果如下：

实验学时：    2

实验日期：2012年3月29日

实验要求：

1、掌握网页的基本框架。

2、掌握框架、框架集标签的用法。 

3、握使用代码生成框架网页。 

实验内容：

答：HTML代码如下：

 框架的应用

 网页效果如下：

实验学时：    2

实验日期：2012年4月12日

实验要求：

    1、下拉式菜单的设计。

2、为对象设置行为。

3、使用行用控制层，制作行为的动态效果。

实验内容：

答：步骤如下：

1、通过选择菜单【窗口】里的【行为】命令，或直接按下快捷键shift+F4即可打开【行为】面板。

2、打开【插入】菜单中的【布局】，选择【绘制AP Div】命令，在页面上绘制三个矩形框，可以自行设置其大小，在这里，我选择了高50像素、宽150像素。

3、分别在三个矩形框里添加一个1行1列，宽150像素的表格，这样有利于文字的输入与设置。然后调整大小，让其与矩形框完全吻合，可以在属性栏里设置其背景色等细节部分。

4、在【院系设置】栏下面，绘制一个AP Div元素，将其大小设置为高150（因为我打算在这里输入三行文字），宽150像素。接下来，仿照步骤3，添加一个3行1列的表格，具体设置也如上。

5、选中【院系设置】，为其添加行为（动作+事件），当鼠标从上面滑过时，显示下面的矩形框，当鼠标离开时，下面的矩形框隐藏。具体如下：

6、选中【管理学院】所在矩形框，为其添加如步骤5所示的行为。实现党鼠标滑过时，显示该矩形框，当鼠标移出时隐藏该矩形框的效果。具体如下：

7、保存该页面。并查看、测试效果。如下：

实验学时：    2

实验日期：2012年4月19日

实验要求：

1、能够根据要求设置层的大小。

2、熟练运用层的位置、层的嵌套以及叠加。

实验内容：

1. 在网页head头部定义一个apDiv1的ID样式，在网页主体body元素内插入一个Div元素，该元素应用了ID样式apDiv1。

2. 表格和层的相互嵌套

 菜单1

 菜单2

 菜单3

 菜单1-1

 菜单1-2

 菜单1-3

 菜单2-1

 菜单2-2

 菜单2-3

 菜单3-1

 菜单3-2

 菜单3-3

实验项目：  CSS

实验学时：    2

实验日期：2012年4月26日

实验要求：

1、了解CSS的标签样式，类样式，ID样式和伪类样式。

2、会使用CSS的嵌入式样式表。

3、掌握CSS的部分属性分类与使用。

实验内容：

答： HTML代码如下：

 黑体";

 幼圆";

 宋体";

 莫生气

 人生就像一场戏，因为有缘才相聚。

 相扶到老不容易，是否应该去珍惜？

网页效果如下：

实验学时：    2

实验日期：2012年5月10日

实验要求：

1、掌握并练习JavaScript的基本语句。

2、加深对网页制作所涉及的相关技术的理解。

3、初步了解JavaScricpt脚本源程序。

4、练习文件对象的使用。

实验内容：

答：HTML代码如下：

   

      请选择背景颜色：

网页效果如下：

实验学时： 2

实验日期：2012年5月17日

实验要求：

1、ASP运行环境的建立。

2、掌握VBScript语言基础。

3、掌握ASP内置对象的应用。

实验内容：

答：HTML代码如下：

   

<%if Request.Cookies("UserName")<>" " then

  Response.write"欢迎您:"&request.Cookies("UserName")

else

%>

<%

if request.Form("UserName")<>" " and request.Form("Email")<>" " then

      Response.cookies("UserName")=Request.Form("UserName")

      Response.cookies("Email")=Request.Form("Email")

      Response.cookies("UserName").Expires=date()+Cint(Request.Form("Save"))

      Response.cookies("Email").Expires=date()+Cint(Request.Form("Save"))

      Response.redirect("6-19.asp")

      Response.end

    end if

%>

网页效果如下：