南岳学院

衡阳师范学院经济与法律系《网页设计与制作》教案唐四薪

网页设计与制作知识点

第一部分HTML

1.在常用表格模式下进行网页布局（经济学专业编号）

2.在布局表格下进行布局

1．制作双线边框的表格（南岳学院电商编号）

2．制作单线边框的表格

1．制作占位表格（电商编号）

2．各种文字超链接的制作（一般链接，锚链接，email链大寒文案 接及打开方式）

3．制作图像链接和热区链接

4．在表格中插入图片和透明flash

5．制作用户登录表单

无序列表的使用（无序列表的嵌套）（此条不做）

6．层与行为（显示隐藏层，交换图像）

第二部分CSS

7．修改文字大小和行距

8．制作动态超链接(a:hover)

9．用CSS创建交互（a元素的交互和非a元素的交互）

10．制作首字下沉和图文混排和分栏（float定位）

11．相对定位和绝对定位的实验

12．（此学号为空）

13．美化表单样式(盒子的边框背景属性)

14．用CSS盒子模型制作导航条

15．用无序列表制作tab样式导航条

16．利用盒子的定位属性制作缺角菜单

17．用滑动门技术制作圆角菜单

18．用4图象法制作可变宽圆角栏目框

19．CSS＋DIV固定宽度的三栏布局

20．可变宽度布局的制作

第三部分Fireworks

21．规则和不规则图形的绘制（组合路径）

22．图片融合技术（填充、渐变和蒙版）

23．文字效果（阴影、倒影、描边）

24．用fireworks做按钮和下拉菜单

25．切片和图像的导出

第四部分JavaScript

26．制作层的Zindex改变的导航条

27．用CSS和JavaScript制作下拉菜单

28．制作Tab面板

-1-

衡阳师范学院经济与法律系《网页设计与制作》教案唐四薪

第五部分ASP

29．创建虚拟目录和动态站点

30．将静态网页转换为动态网页（切割头尾网页，导出CSS文件）

31．数据库的连接

32．创建记录集

33．绑定动态数据到页面

34．创建重复区域服务器行为

35．转到详细页面服务器行为

36．记录新闻点击次数

37．创建记录集分页

38．新闻搜索页面的设计

39．插入动态图片

40．用IIF函数将过长新闻标题用省略号取代后部

41．创建用户登录验证界面（包括验证表单数据不为空）

42．限制非注册用户对页的访问

43．创建添加新闻页面

44．创建编辑新闻页面

练习

第一章HTML

1．分析一个URL的结构

//web/1/200807/

信息被放在一台被称为www的服务器上，是一个已被注册的域名，域名对应一台

DNS服务器，cn表示中国，主机名，域名合称为主机头。/web/是服务器网站目录下的一个

文件夹，这个一致资源地址将带你到这个文件，是网页的文件名

2．一个最简单HTML文档的结构

3．HTML元素由标记

„„

4．带有属性的HTML元素的结构

-2-

衡阳师范学院经济与法律系《网页设计与制作》教案唐四薪

例1：下列HTML元素的写法分别错在什么地方？

5．常见的HTML标记

1)基本标记

2)

3)

4)

5)

文本标记

段落标记

图像标记

表格标记

6)列表标记

7)表单标记

6．HTML标记的分类

1）单标记和配对标记

2）行内元素和块级元素

7．HTML元素和XHTML元素的区别

在HTML语言规范的基础上，XHTML元素还有下面一些额外的要求：

1）必须小写；2）属性值必须用双引号引起；3）所有标记包括单标记都必须封闭。

例2：下列哪条html语句的写法符合XHTML规范：（）

A
B

CD

8．Dreamweaver中插入HTML标记的一些快捷方式：

Enter插入

„„

Ctrl＋shift＋space插入 

-3-

衡阳师范学院经济与法律系《网页设计与制作》教案唐四薪

第一讲网页设计概述

【教学内容】

讲解网页设计的相关术语成都游玩 及网站制作的基本流程。

【教学目的】

使学生对网站及网页有一定的认识，激发学生学习网页设计的兴趣。

【教学重点】

网页设计中的若干术语。

【教学难点】

理解网页设计中的若干术语。

【教学方式】

讲授式、讨论式、案例分析式。

【教学参考】

1、《网页设计与制作》杨尚森曲宏山贾文峰等著电子工业出版社。

2、《Internet网页工场》Wittime工作室重庆出版社。

3、《WEB网站设计》JoelSklar著高等教育出版社。

4、《HTML网页制作教程》材义语编著铁道出版社。

【新课内容】

1.1WWW和URL

1.1.1Web的起源

Web是WorldWideWeb的简称，一般也称之为WWW或3W

1.1.2Web的特点和结构

Web最大的特点是使用了超文本（Hypertext）

WWW采用C/S（客户机/服务器）工作模式

在浏览器和服务器之间应用HTTP（HyperTextTransferProtocol，超文本传输协议）作

为网络应用层通信协议1.1.3URL

URL的完整格式

协议://主机名或IP地址：端口号/路径名/文件名

1.2IE6等浏览器的使用

Web浏览器是浏览Internet资源的客户端软件

在Windows环境下使用的浏览器主要有InternetExplorer、NetscapeNavigator、Mosaic

Firefox等

1.2.1IE6,IE7，Firefox的界面

1.2.2IE6,IE7，Firefox的使用

-4-

衡阳师范学院经济与法律系《网页设计与制作》教案唐四薪

1.3网页中所使用的技术

1.3.1HTML语言和XML语言

1、HTML语言

HTML只使用SGML中很小一部分标记

HTML语言（HyperTextMarkupLanguage超文本标记语言）

HTML是纯文本的语言，其源代码可以用各种文本编辑工具进行编辑，常用的网页制

作软件如FrontPage、Dreamweaver等实际上是自动生成HTML源代码的工具

2、XML语言

XML（eXtensibleMarkupLanguage）

1.3.2动态网页

1.3.3多媒体技术的应用

1.3.4Web服务器端程序

1.4制作网页的基本方法

1.4.1制作网页的基本步骤

1、确定网页的内容

2、设计网页的组织结构

3、资料的收集与整理

4、选择网页的设计方法

1.4.2制作网页时要注意的问题

1、网页的标题要简洁，明确。

2、在文本中要使用水平线，以分割不同部分。

3、对重点段落要强调显示。

4、网页中插入的图片要尽量的小。

5、图形要附加文字说明，以便关闭图像时查看。

6、网页中引用的资料及商标（或图标），不能侵犯版权。

【课后小结】

通过学习，认识网络、网站、网页及相关信息，理解网页制作的流程及了解相应开发工

具，为设计网页做准备。

第二讲HTML的基本标志与格式标志

【教学内容】

讲解HTML基本标志对和格式标志。

【教学目的】

使学生标志对与格式标志对的使用。

【教学重点】

格式标志的使用。

【教学难点】

-5-

衡阳师范学院经济与法律系《网页设计与制作》教案唐四薪

列表标志的使用。

【教学方式】

讨论式、案例分析式、练习式。

【教学参考】

1、《网页设计与制作》杨尚森曲宏山贾文峰等著电子工业出版社。

2、《WEB网站设计》JoelSklar著高等教育出版社。

3、《HTML网页制作教程》材义语编著铁道出版社。

【新课内容】

2.1HTML文档的基本结构

2.1.1HTML语法

1、双标记

语法：

<标记>内容

2、单标记

语法：<标记>

最常用的单标记是

3、标记属性

语法

<标记属性1属性2属性3…>

例子

4、注释语句

格式

例子

2.1.2HTML文档的基本结构

【课后小结】

通过本次课的学习,要求能熟练掌握网页面的基本标志与格式标志,并能灵活运用

列表,有序列表,无序列表标志及属性。

第三讲HTML的文本、图片与超级链接标

志

【教学内容】

讲解HTML标准中的文本、图片与超级链接标志

【教学目的】

*使学生了解标题元素,掌握字体,上下标,及特殊字符的标志。

-6-

衡阳师范学院经济与法律系《网页设计与制作》教案唐四薪

*使学生掌握图片标志,声音标志及相应的属性,学会利用标志在网页中插入声音与图

片。

*使学生掌握超级链接标志的使用。

【教学重点】

*字体、图片和超级链接标志的使用。

*网页中特殊符号的输入。

【教学难点】

*理解特殊符号对应的标志。

*理解img标志中属性的意义。

*理解书签超级链接的意义。

【教学方式】

讨论式、案例分析式、练习式。

【教学参考】

1、《网页设计与制作》杨尚森曲宏山贾文峰等著电子工业出版社。

2、《WEB网站设计》JoelSklar著高等教育出版社。

3、《HTML网页制作教程》材义语编著铁道出版社。

【新课内容】

2.2插入文字

2.2.1划分段落

格式

段落内容

2.2.2插入标题文字

格式

标题内容

2.2.3字号属性

设置基准字号：

网页内的其他文字，采用下面的格式来定义

......

Size的有效范围是1（最大）到7（最小）。如果在Size的值前面带上“+”号或“-”号，则

表示相对于基础字体增大或减小若干字号。

2.2.4颜色属性

两种方式

字符串

2.2.5字体属性

2.2.6文本修饰

......，文字以粗体显示。

......，文字显示为斜体。

......，显示下划线。

......，中心线贯穿文字。

-7-

衡阳师范学院经济与法律系《网页设计与制作》教案唐四薪

......，强调文字，通常用斜体。

......，特别强调的文字，通常用黑体。

......，以等宽体显示西文字符。

......，使文字大小相对于前面的文字增大一级。

......，使文字大小相对于前面的文字减小一级。

^......，使文字成为前一个字符的上标。

_......，使文字成为前一个字符的下标。

......，使文字显示为闪烁效果。

2.2.6文本修饰

2.2.7预格式化文本

使用预格式化标记

不再忽略在此之间的空格、制表符与回车符等元素

2.2.8转义字符与特殊字符

一般转义符都是以“&”开始，以“；”结束，一个转义符之间不能有空格

2.2.9文本强制换行和不换行

文本强制换行

不换行

2.2.10插入水平线

使用

属性：Width，Size，Align，Noshade，color

2.2.11使用列表

1、无序列表

列表条目1

......

2、有序列表

列表条目1

3、定义列表

……

-8-

衡阳师范学院经济与法律系《网页设计与制作》教案唐四薪

2.3插入图片

2.3.1在网页中插入图片

基本格式

2.3.2图片的属性

2.4建立超级链接

2.4.1指向一个目标

1、建立超级链接

字符串

2、为图片建立超级链接

3、链接到邮件和多媒体文件

链接到邮件

请与我联系

2.4.2使用锚点

使用锚点可以使用户在一个较长的文档中跳转，方便地找到要阅读的内容。

建立锚点：

锚点文字

使超级链接指向已定义的锚点。

文字

文字

2.4.3新窗口和基准链接

1、打开新窗口

Target="window-name">开一个新窗口

2、基准链接

在与之间设定

2.4.4图像地图

图像地图的格式为：

-9-

衡阳师范学院经济与法律系《网页设计与制作》教案唐四薪

......

2.4.4图像地图

【课后小结】

本节介绍了在网页中加入文本、图片和超级链接的标志与相应属性，熟练运用这些标志

是制作多媒体网页的基础。超级链接标志中，书签链接是一类特殊的链接方式，理解和

使用书签链接学习HTML中超级链接标志的难点。

第四讲HTML表格、表单与框架标志

【教学内容】

讲解HTML中制作表格、表单与框架的标志。

【教学目的】

使学生掌握简单表格、表单与框架的制作。

【教学重点】

*表格中单元格的合并以及表格嵌套和叠加操作。

*框架的嵌套使用。

*表单元素标志与属性。

【教学难点】

*理解表格属性rowspan与colspan的含义以及表格嵌套实现的基本思想。

*理解框架属性name、target的意义。

*理解表单中相应元素对应标志及属性的含义。

【教学方式】

案例分析式、项目教学

【教学参考】

1、《网页设计与制作》杨尚森曲宏山贾文峰等著电子工业出版社。

2、《WEB网站设计》JoelSklar著高等教育出版社。

3、《HTML网页制作教程》材义语编著铁道出版社。

【新课内容】

2.5插入表格

2.5.1在网页中插入表格

表格的基本构成元素：表头，单元格，列，行

2.5.2嵌套的表格

2.5.3表格的属性设置

2.5.4单元格属性设置

2.6表单的应用

表单在Web网页中用来给访问者填写信息，从而能获得用户信息，使网页具有交互的

功能。

2.6.1创建表单

2.6.2用定义用户交互

（1）单行文本输入区

（2）密码输入区

（3）单选框

（4）复选框

（5）隐藏区域

（6）按钮

2.6.3定义下拉式菜单

你选修的课程：

计算机

英语

逻辑学

心理学

2.6.4定义多行文字输入区域

请输入你的详细介绍：

文字

2.7框架窗口

框架把窗口划分成几个子窗口，各个子窗口可以调入各自的HTML文档，最后形成充

满整个窗口的网页。

2.7.1框架的定义

2.7.2框架属性设置

Rows="pixels，*“

FrameBborder="0“Border=0

-11-

衡阳师范学院经济与法律系《网页设计与制作》教案唐四薪

FrameSpacing="2“

BorderColor="#008000“

>

2.7.3子窗口属性设置

FrameBorder="0"NoresizeFrameSpacing="6"BorderColor="#0000FF"Target="rtop">

2.7.4常见的框架窗口划分方法

（1）标题和正文，分为上下两部分

（2）层次结构，分为上中下三部分

（3）目录和标题，分为左上、左下、右三部分

（4）标题、目录和正文，分为上、左下、右下三部分

（5）嵌套目录，分为左、右上、右下三部分

2.7.5不支持框架的网页

</p></div><div><p><BODY>很抱歉，馈下使用的浏览器不支援框架功能，请转用新的浏览器。</p></div><div><p></BODY></p></div><div><p>

2.7.6内部框架

【课后小结】

表格在网页设计中应用广泛，熟练掌握表格的基本标志及配合使用的属性的意义，是灵

活运用表格的基础。表格的嵌套是表格制作中的一个难点，关键是要抽象出嵌套表格对

应的简单表格模型，再将模型中单元格的位置使用内嵌表格代替。

框架结构是布局网页的一种常用方式，要掌握框架及其嵌套的实现，以及在框架中设置

超级链接时目标框架位置的设置。

表单是网页实现交互处理的工具,熟练掌握表单中元素的标志和属性，是设计表单网页

关键。

第五讲HTML标志综合运用案例

【教学内容】

综合运用所学过的HTML标志书写网页。

【教学目的】

使学生能够书写简单的HTML网页。

【教学重点】

使用所学的HTML标志书写网页。

【教学难点】

HTML的综合运用。

【教学方式】

案例分析式、讨论式、练习式。

-12-

衡阳师范学院经济与法律系《网页设计与制作》教案唐四薪

【教学参考】

1、《网页设计与制作》杨尚森曲宏山贾文峰等著电子工业出版社。

2、《WEB网站设计》JoelSklar著高等教关于文明的诗 育出版社。

3、《HTML网页制作教程》材义语编著铁道出版社。

【新课内容】

1、用记事本书写HTML网页。

2、利用案例进行HTML网页的综合讲解。

3、要求学生按规定书写一个完整的HTNL网页。

【课后小结】

HTML是目前制作网页时必须掌握的一种语言，学好HTML语言是为以后对《网页设

计》这门课程更深入的学习打下扎实的基础。

第六讲Dreamweaver中简单WEB站点建

立与管理

【教学内容】

讲解Dreamweaver的工作界面和基本操作。

【教学目的】

使学生掌握网页制作工具Dreamweaver的基本操作方式。

【教学重点】

网页制作工具Dreamweaver的界面和基本基本操作。

【教学难点】

掌握一个新的开发工具。

【教学方式】

讲授式、项目模块式、演示教学。

【教学参考】

1、《网页设计与制作》杨尚森曲宏山贾文峰等著电子工业出版社。

2、《WEB网站设计》JoelSklar著高等教育出版社。

3、《Dreamweaver网页设计案例教程》白煜编著清华大学出版社。

4、《DreamweaverMX2004完美网页设计与制作》姜楠编著中国青年出版社。

【新课内容】

3.1Dreamweaver概述

3.1.1Dreamweaver的工作界面

3.1.2Dreamweaver4的基本操作

1、直接建立新网页

“文件”→“新建”(Ctrl+N)

2、打开已有的网页

“文件”→“打开”

3、保存编辑过的网页

-13-

衡阳师范学院经济与法律系《网页设计与制作》教案唐四薪

“文件”→“保存”，直接保存

“文件”→“另存为”,换名保存

4、预览正在编辑的网页

“文件”→“在预览器中预览”

5、设置网页属性

“修改”→“页面设置”

（1）标题

（2）背景图像

（3）背景色

（4）文字颜色

（5）超级链接颜色

（6）左边界上边界

（7）文件编码方式

（8）网页蓝图

6、导入Word文件

“文件”→“导入”→“导入WordHTML”

3.1.3用Dreamweaver创建和管理站点

1、创建本地站点

“站点”

→“新建站点”

2、管理站点

“站点”

→“定义站点”

3、上传和下载文件

【课后小结】

Dreamweaver是一款由Macromedia公司开发的专业HTML编辑器，用于对WEB站点、

WEB页面和WEB应用程序进行设计、编码和开发。无论是刚接触网页设计的初学者

还是专业的WEB开发人员，Dreamweaver都在前卫的设计理念和强大的软件功能方面

给予了充分可靠的支持。因此学好Dreamweaver对以后的网页设计有很大的帮助。

第七讲Dreamweaver中静态网页设计

【教学内容】

讲解利用Dreamweaver进行静态页面的制作。

【教学目的】

使学生掌握利用Dreamweaver对页面进行文本、图象、超级链接、表格以及框架等的

编辑。

【教学重点】

通过对工具软件Dreamweaver的操作，制作出完整的静态页面。

【教学难点】

了解静态网页的含义

【教学方式】

讲授式、项目模块式、演示教学。

-14-

衡阳师范学院经济与法律系《网页设计与制作》教案唐四薪

【教学参考】

1、《网页设计与制作》杨尚森曲宏山贾文峰等著电子工业出版社。

2、《WEB网站设计》JoelSklar著高等教育出版社。

3、《Dreamweaver网页设计案例教程》白煜编著清华大学出版社。

4、《DreamweaverMX2004完美网页设计与制作》姜楠编著中国青年出版社。

【新课内容】

3.2在页面中加入文字和图像

3.2.1文字的添加和处理

（1）文字属性面板的使用

3.2.2插入和优化图像

（1）准备图像

把网页中所用到的图像文件预先拷贝到站点文件夹中

（2）插入图像

（3）设置图像属性

（4）创建图像地图

3.3超级链接的运用

3.3.1插入超级链接

（1）直接在属性面板的链接项填入链接的地址。

（2）在属性面板单击浏览文件按钮打开浏览窗口来选择链接的网页。

（3）利用指向文件图标创建链接。

3.3.2超级链接的运用

（1）链接其他网站

在链接栏填写URL

选择目标网页显示的窗口。_blank、parent、_lf、_top

（2）链接其他文件

输入网页文件名外

使用属性面板上的指向文件图标，创建内部链接

（3）链接E-mail

直接在链接栏填写E-mail地址。

利用对象面板插入E-mail

（4）锚点链接

建立锚点:“隐藏”→“插入命令锚点”→填入锚点的名称

建立锚点链接:在链接栏中输入符号“#”和锚点名称。

3.4.表格的应用

3.4.1表格的创建

A.创建表格

-15-

衡阳师范学院经济与法律系《网页设计与制诗经中的好名字 作》教案唐四薪

（1）使用菜单“插入”→“表格”。

（2）单击对象面板上的子菜单中插入表格按钮。

（3）按CTRL+ALT+T组合键。

B.选择表格元素

（1）选取整个表格

（2）选择行和列

（3）选择单元格

3.4.2表格属性的设置

1、表格整体属性设置

2、行列和单元格属性设置

3.5.在网页中创建表单

A创建表单

“插入”→“表单”

使用菜单“窗口”调出“对象”面板，“表单”→“插入”

B添加表单元素

（1）添加文本域

“插入”→“表单对象”→“文本域”

设置TextField，字符宽度，最多字符，类型

（2）添加选择域

①在表单中插入单选按钮。“插入”→“表单对象”→“单选按钮”

②在表单中插入复选按键。“插入”→“表单对象”→“复选钮”

（3）添加列表和下拉式菜单

（4）添加按钮

（5）添加文件域

【课后小结】

了解静态网页的含义，利用DreamweaverMX2004的强大功能制作出各色各样的页面，

为以后的学习打下坚实的基础。

第八讲Dreamweaver中动态网页设计

【教学内容】

讲解利用Dreamweaver进行动态页面的制作。

【教学目的】

使学生掌握利用Dreamweaver作出简单的动态页面。

【教学重点】

理解动态页面的含义以及数据库的使用。

【教学难点】

了解动态网页的含义。

【教学方式】

讲授式、项目模块式、演示教学。

-16-

衡阳师范学院经济与法律系《网页设计与制作》教案唐四薪

【教学参考】

1、《网页设计与制作》杨尚森曲宏山贾文峰等著电子工业出版社。

2、《WEB网站设计》JoelSklar著高等教育出版社。

3、《Dreamweaver网页设计案例教程》白煜编著清华大学出版社。

4、《DreamweaverMX2004完美网页设计与制作》姜楠编著中国青年出版社。

【新课内容】

1、初识数据库与ASP

2、建立数据库

3、在DreamweaverMX2004中连接数据库

4、绑定数据库

5、显示记录

6、添加记录

7、修改记录

8、删除记录

【课后小结】

了解动态网页的含义，本节详细的介绍了如何在DreamweaverMX2004中实现与数据

库的连接。动态网页是当今的主流，学好动态网页的制作是必须的。

第九讲Dreamweaver综合性网页设计案例

【教学内容】

实例讲解利用Dreamweaver进行留言本的制作。

【教学目的】

使学生掌握利用Dreamweaver作出简单的动态站点。

【教学重点】

动态站点的制作流程。

【教学难点】

数据库的创建、连接与显示。

【教学方式】

讲授式、项目模块式、演示教学。

【教学参考】

1、《网页设计与制作》杨尚森曲宏山贾文峰等著电子工业出版社。

2、《WEB网站设计》JoelSklar著高等教育出版社。

3、《Dreamweaver网页设计案例教程》白煜编著清华大学出版社。

4、《DreamweaverMX2004完美网页设计与制作》姜楠编著中国青年出版社。

【新课内容】

1、制定网站设计方案。

2、建立数据库。

3、在DreamweaverMX2004中创建站点。

4、在DreamweaverMX2004中连接数据库。

5、发表、编辑、删除留言部分制作。

6、管理留言

【课后小结】

-17-

衡阳师范学院经济与法律系《网页设计与制作》教案唐四薪

通过具体实例的讲解剖析，使学生更加直观的了解了动态网站的制作流程。留言本是一

个典型的并且简单的动态站点案例，上手容易。

第十讲VBScript概述

【教学内容】

讲解VBScript的基本概念及其特点。

【教学目的】

使学生对VBScript有个初步的了解。

【教学重点】

什么是VBScript。

【教学难点】

如何在HTML页面中添加VBScript代码。

【教学方式】

讲授式、项目模块式、演示教学。

【教学参考】

1、《网页设计与制作》杨尚森曲宏山贾文峰等著电子工业出版社。

2、《WEB网站设计》张锦祥主编科学出版社。

3、《网页编程技术与实例》谭浩强主编人民邮电出版社。

【新课内容】

4.1VBScript语言简介

4.1.1什么是VBScript

VBScript是一种基于对象和事件驱动并具有安全性能的脚本语言。

具有以下几个基本特点：

(1)是一种脚本编写语言

(2)是基于对象的语言

(3)简单性

(4)安全性

(5)动态性

(6)跨平台性

4.1.2VBScript程序运行和编辑环境

运行:在任何安装IE或Navigator浏览器的计算机上

编辑：可以用任何文本文件编辑器（如Notepad、WordPad、WPS、DOS的EDIT命令

等）进行编辑，也可以用网页制作工具编辑

4.1.3把VBScript代码嵌入HTML文档

4.1.3把VBScript代码嵌入HTML文档

("这是紫星的电脑世界");

alert("这是紫星的电脑世界");

【课后小结】

VBScript是程序开发语言VisualBasic家族的最新成员，可以将灵活的脚本应用于更广

泛的领域，包括MicrosoftInternetExplorer中的Web客户端脚本和MicrosoftInternet

InformationServer中的Web服务器端脚本。掌握VBScript是开发动态网站的必要条件。

第十一讲VBScript的基本元素与输入输出

【教学内容】

讲解VBScript的数据类型、常量、变量、运算符以及VBScript的基本语句。

【教学目的】

使学生对VBScript这种开发语言的基本语法有个初步认识。

【教学重点】

VBScript的基本元素与输入输出。

【教学难点】

对VBScript的数据类型、常量、变量、运算符建立起基本概念。

【教学方式】

讲授式、项目模块式、演示教学。

【教学参考】

1、《网页设计与制作》杨尚森曲宏山贾文峰等著电子工业出版社。

2、《WEB网站设计》张锦祥主编科学出版社。

3、《网页编程技术与实例》谭浩强主编人民邮电出版社。

【新课内容】

4.2.基本数据类型

数值（整数和实数）

字符串型（用“...”号或′...′括起来的字符或数值）

布尔型（使用True或Fal表示）

空值

VBScript采用弱类型的形式，因而一个数据的变量或常量不必首先作声明

4.2.1基本数据类型

-19-

衡阳师范学院经济与法律系《网页设计与制作》教案唐四薪

1、常量

（1）整型常量

可以使用十六进制、八进制和十进制表示。

（2）实型常量

由整数部分加小数部分表示，如12.32、193.98。使用科学或标准方法表示：5E7、4e5

等。

（3）布尔值

只有两种状态：True或Fal。

（4）字符型常量

使用单引号“′”或双引号“″”括起来的一个或几个字符。

（5）空值（null）

（6）特殊字符（以反斜杠（）开头的字符串）

2、变量

变量的主要作用是存取数据、提供存放信息的容器。

对于变量必须明确变量的命名、变量的类型、变量的声明及其变量的作用域。

(1）变量的命名

Ａ、必须是一个有效的变量，央企高管薪酬 即变量以字母开头，中间可以出现数字如test1、text2等。

除下划线“_”作为连字符外，变量名称不能有空格、＋、－、，或其它符号。

Ｂ、不能使用JavaScript中的保留字作为变量。

（2）变量的类型

（3）变量的声明及其作用域

使用var关键字对变量作声明

有全局变量和局部变量

4.2.表达式和运算符

１、表达式

可以分为算术表述式、字串表达式、赋值表达式以及布尔表达式等.

２、运算符

（1）双目运算符和单目运算符

双目运算符：操戍守边关 作数1运算符操作数2

如50＋40、"This"+"that"等。

单目运算符只需一个操作数，其运算符可在前或后。

（2）算术运算符

（3）比较运算符

（4）逻辑运算符

3、注释符

//，在本行中所有在“//”符号之后的字符将被解释器忽略。

/*......*/，在/*和*/之间的所有字符（可持续多行）将被解释器忽略。

【课后小结】

本节介绍了VBScript的基本元素，包括VBScript的数据类型、常量、变量和运算符，

并且初步提到了VBScript的输入输出基本语句，为下节课的内容作好准备。

-20-

衡阳师范学院经济与法律系《网页设计与制作》教案唐四薪

第十二讲VBScript的条件语句、循环语句

和过程

【教学内容】

讲解VBScript的一些基本语句以及过程。

【教学目的】

使学生基本掌握对VBScript的基本语句语法格式和过程。

【教学重点】

VBScript的基本语句语法格式。

【教学难点】

VBScript的基本语句语法格式和过程过于概念化抽象化，学生掌握有难度。

【教学方式】

讲授式、项目模块式、演示教学。

【教学参考】

1、《网页设计与制作》杨尚森曲宏山贾文峰等著电子工业出版社。

2、《WEB网站设计》张锦祥主编科学出版社。

3、《网页编程技术与实例》谭浩强主编人民邮电出版社。

【新课内容】

4.3VBScript基本语句

4.3.1控制程序流程

１、if条件语句

if(表达式){

语句段1;

......

}

el{

语句段2;.....

}

2、for循环语句

for(初始化；条件；增量)

3、while循环

while（条件）

语句集；

４、break和continue语句

break语句使得循环从for或while中跳出

continue使得跳过循环内剩余的语句而进入下一次循环

4.3.2函数

函数可以封装那些在程序中可能要多次用到的模块，并可作为事件驱动的结果而调用的

-21-

衡阳师范学院经济与法律系《网页设计与制作》教案唐四薪

程序。从而实现一个函数与事件驱动相关联。事件可以是页面调入、单击、表单送出等。

【课后小结】

本节详细介绍了VBScript的基本语句语法格式和过程，这些概念过于抽象化，学生掌

握过程中有很大难度，这就要求我们教师不断的耐心的详细的进行讲解。

第十三讲VBScript文档对象模型

【教学内容】

讲解VBScript的文档对象模型。

【教学目的】

使学生掌握对VBScript文档对象模型的理解和运用。

【教学重点】

什么是VBScript的文档对象模型。

【教学难点】人力资源管理就业

VBScript文档对象模型的灵活运用。

【教学方式】

讲授式、项目模块式、演示教学。

【教学参考】

1、《网页设计与制作》杨尚森曲宏山贾文峰等著电子工业出版社。

2、金鹰视后 《WEB网站设计》张锦祥主编科学出版社。

3、《网页编程技术与实例》谭浩强主编人民邮电出版社。

【新课内容】

4.4基于对象的VBScript语言

4.4.1对象的基础知识

1.对象的基本结构

2.引用对象的途径

3.有关对象操作语句

（1）in语句

用于对已知对象的所有属性进行操作的控制循环，它将一个已知对象的所有属性反复赋

值给一个变量，而不是使用计数器来实现。此语句无需知道对象中属性的个数即可进行

操作。

（2）with语句

说明要引用的对象，在该语句体内，任何对变量的引用被认为是这个对象的属性的引用，

这种方法可节省一些代码，避免引用混乱。

使用形式为

withobject{...}

（3）this关键词

（4）new运算符

4.对象属性的引用

-22-

衡阳师范学院经济与法律系《网页设计与制作》教案唐四薪

（１）使用点（.）运算符

（２）通过对象的下标实现引用

（３）通过属性名称字符串的形式实现引用

对象的方法的引用

静态对象，在引用该对象的属性或方法时不需要为它创建实例；

动态对象，在引用它的对象属性或方法时必须为它创建一个实例。

4.4.2常用对象的属性和方法

字符串对象string

（1）string对象的属性

该对象只有一个属性length

（2）String对象的方法

锚点，anchor()

有关字符显示的控制方法。Big，Italics()，bold()，blink()，small（），fixed()，fontsize(size)

字体颜色方法。fontcolor(color)

字符串大小写转换。toLowerCa()，toUpperCa()

字符搜索。indexOf[charactor,fromIndex]

返回字符串的一部分字符串。ubstring(start,end)

算术函数的math对象

日期及时间对象date

4.4.3VBScript中的系统函数

1、eval（字符串表达式），返回字符串表达式中的值。

如test=eval("8+9+5/2")，返回的test值为19.5，而不是字符串"8+9+5/2"。

2、unEscape(string)，返回字符串ASCII码。

3、escape(character)，返回字符的编码。

4、parFloat(floustring)，返回实数。

5、parInt(numbestring,radix)，返回不同进制的数。radix是数的进制，numbestring是

字符串数。

4.4.4创建新对象

4.4.5VBScript中的数组

4.5使用内部对象系统

4.5.1浏览器中的对象

1、文档对象的作用

把文档中的链接、表单、标签等基本元素包装起来，提供给编程人员使用。

2、文档对象中的属性

（1）alinkcolor

（2）linkcolor

（3）vlinkColor

（4）bgcolor

（5）fgcolor

（6）LastModified

（7）Location

（8）title

-23-

衡阳师范学院经济与法律系《网页设计与制作》教案唐四薪

３、Document对象中的对象

Links

AnchorsForms

这三个对象分别组成各自的数组，网页中每个对象的数目包含在属性length中。

4.5.2窗口元素的控制

【课后小结】

文档对象模型是可以被任何脚本引擎访问的对象的集合，它提供了对Web浏览器的访

问。但VBScript语言没有其对象模型，它使用MicrosoftInternetExploer浏览器的对象

模型，这是一种具有层次结构的对象模型，其中每个对象都有属性、方法和事件，而属

性本身也是对象，它又包含属性、方法和事件。这是学生应该注意的地方。

第十四讲ASP概述

【教学内容】

讲解ASP的基本理论概念。

【教学目的】

使学生掌握对“什么是ASP”有个基本的认识

【教学重点】

什么是ASP。

【教学难点】

又一个新的概念ASP要求学生掌握。

【教学美女图像 方式】

讲授式、项目模块式、演示教学。

【教学参考】

1、《网页设计与制作》杨尚森曲宏山贾文峰等著电子工业出版社。

2、《WEB网站设计》张锦祥主编科学出版社。

3、《网页编程技术与实例》谭浩强主编人民邮电出版社。

【新课内容】

5.1ASP概述

5.1.1ASP简介

（1）ASP的含义

ASP（ActiveServerPages，动态服务器网页）是一种基于服务器的编程技术，它并不是

一种脚本语言，它提供的只是一种服务器端的脚本环境。从某种意义上说ASP是一种

附加特性扩展了的HTML文件。

（2）ASP的特点

纯文本文件

设计方便

与平台无关性

较强的安全性

-24-

衡阳师范学院经济与法律系《网页设计与制作》教案唐四薪

扩充能力强

访问数据库方便

（3）ASP的用途

ASP可以实现计数器、留言本、聊天室等应用程序。

①在网站中设计滚动显示的广告栏；

②从HTML的表单中接受信息并保存到数据库中；

③可以根据不同的访问时间显示不同的内容，以创建个性化的网页；

④在网页中添加计数器；

⑤根据用户的浏览器的版本和类型显示不同档次的内容；

⑥跟踪用户网站上的活动并存入日志文件。

5.1.2ASP的工作原理

ASP工作的过程分为下面的几步：

①用户在浏览器的地址栏中输入要访问的主页地址并按回车键触发这个申请。

②浏览器将ASP申请发送到含有IIS的Web服务器上。

③Web服务器接受这些申请并根据.asp的后缀意识到这是一个ASP文件。

④Web服务器从本地硬盘或内存读取适当的ASP文件，然后向特定的名为

程序发送文件。

⑤Web服务器将ASP文件从头到尾执行并根据命令要求生成标准的HTML文件，并

将生成的HTML文件传送给浏览器。

⑥传送回来的HTML文件将被用户的浏览器所解释，并将其结果显示在用户的浏览器

上。

【课后小结】

ASP的英文全称是ActiveServerPage，翻译为中文就是动态网页。ASP对WEB服务器

的增强，让HTML网页浏览器从服务器取得WEB页面的工作方式有所改变。理解ASP

的工作原理对以后的进一步学习制关重要。

第十五讲使用ASP对象

【教学内容】

讲解ASP对象的使用。

【教学目的】

使学生掌握对ASP对象的使用方法。

【教学重点】

什么是ASP的对象。

【教学难点】

每种对象的运用都不相同。

【教学方式】

讲授式、项目模块式、演示教学。

【教学参考】

1、《网页设计与制作》杨尚森曲宏山贾文峰等著电子工业出版社。

2、《WEB网站设计》食物作文 张锦祥主编科学出版社。

3、《网页编程技术与实例》谭浩强主编人民邮电出版社。

【新课内容】

-25-

衡阳师范学院经济与法律系《网页设计与制作》教案唐四薪

5.2ASP的内置对象

5.2.1Request对象

⒈利用form集合获取数据

⒉利用QueryString集合获取数据

5.2.2Respon对象

⒈向浏览器输出数据（）

⒉文字打字效果

⒊清除数据（）

⒋使网页转向（ct）

⒌停止向浏览器输出数据（）

5.2.3Application对象

5.2.4Session对象

5.2.5Server对象

Server对象提供对服务器上的方法和属性进行的访问，最常用的方法是创建ActiveX组

件的实例。其他方法用于将URL或HTML编码成字符串，将虚拟路径映射到物理路径

以及设置脚本的超时限期。

⒈向浏览器输出HTML代码的方法（code）

⒉取得文件路径的方法（h）

⒊设置脚本运行时间

【课后小结】

在面向对象编程中，对象就是指具有一组实体的属性数据和操作方法的变量。ASP是

一种面向对象的程序语言，它具有许多对象。通过本节的学习，要求学生熟练掌握ASP

对象的使用方式。

第十六讲使用ASP组件

【教学内容】

讲解ASP组件的使用。

【教学目的】

使学生掌握对ASP组件的使用方法。

【教学重点】

什么是ASP的组件。

【教学难点】

过多的组件使学生掌握起来需要花费很多精力和时间。

【教学方式】

讲授式、项目模块式、演示教学。

【教学参考】

1、《网页设计与制作》杨尚森曲宏山贾文峰等著电子工业出版社。

2、《WEB网站设计》张锦祥主编科学出版社。

3、《网页编程技术与实例》谭浩强主编人民邮电出版社。

【新课内容】

-26-

衡阳师范学院经济与法律系《网页设计与制作》教案唐四薪

5.3ASP的内置组件

5.3.1文件访问组件

1、文件操作组件

⒉文件的处理

3、对文件夹和驱动器进行操作

5.3.2广告轮播组件

1、AdRotator组件的属性

5.3.3浏览器信息组件

⒈BrowCapabilities组件的主要属性

⒉BrowCapabilities组件的工作原理

使用BrowCapabilities组件前必须先创建该组件实例。

Set实例名=Object(“rType”)

5.3.4内容链接组件

【课后小结】

当用ASP编写服务器端应用程序时，必须依靠组件来增强WEB应用程序的功能。事

实上组件是其他人已经编写好的一些程序，我们只要掌握它们的使用方法就可以了。

第十七讲使用ADO对象

【教学内容】

讲解ADO对象的使用方法。

【教学目的】

使学生掌握对ADO对象的使用方法。

【教学重点】

什么是ADO对象。

【教学难点】

如何运用ADO访问数据库。

【教学方式】

讲授式、项目模块式、演示教学。

【教学参考】

1、《网页设计与制作》杨尚森曲宏山贾文峰等著电子工业出版社。

2、《WEB网站设计》张锦祥主编科学出版社。

3、《网页编程技术与实例》谭浩强主编人民邮电出版社。

【新课内容】

5.5ADO数据对象

5.5.1Connection对象

1、Connection对象的方法

Open方法

-27-

衡阳师范学院经济与法律系《网页设计与制作》教案唐四薪

Execute方法

Clo方法

BeginTrans方法

CommitTrans方法

RoolbackTrans方法

2、Connection对象的属性

5.5.2Recordt对象

1、Recordt对象的方法

Open方法

“）

Clo方法

Move方法

Update方法

CancelUpdate方法

UpdateBatch方法

CancelBatch方法

AddNew方法

Delete方法

5.5.3Command对象

1、CreateParameter方法

2、Excute方法

3、Command对象所提供的属性包括

ActiveConnection属性、CommandText属性、CommandType属性、CommandTimeout

属性、Name属性、State属性以及Prepared属性

【课后小结】

ASP环境下对数据库的访问主要是通过ADO数据模型。ADO访问数据库更类似于编

写数据库应用程序。ADO是ASP技术的核心之一，它集中体现了ASP技术丰富而灵

活的数据库访问功能。学好本节是制作动态网站的关键。

第十八讲设计实例——论坛

【教学内容】

实例讲解利用ASP进行论坛的制作。

【教学目的】

使学生掌握ASP网站的制作方式及其流程。

【教学重点】

一个简单ASP网站的制作方式及其流程。

【教学难点】

要求学生综合运用所学过知识。

【教学方式】

案例分析式、讨论式、演示教学。

【教学参考】

1、《网页设计与制作》杨尚森曲宏山贾文峰等著电子工业出版社。

-28-

衡阳师范学院经济与法律系《网页设计与制作》教案唐四薪

2、《WEB网站设计》张锦祥主编科学出版社。

3、《网页编程技术与实例》谭浩强主编人民邮电出版社。

4、《ASP数据库系统开发实例导航》宣小平但正刚张文毅编著人民邮电出版社。

【新课内容】

1、论坛系统功能概述

2、创建数据库

3、查看主题

4、发表主题

5、保存主题

6、回复主题

7、保存回复

【课后小结】

论坛是网络上非常流行的一个功能，通过对以前所学知识的综合运用完成这一网站的设

计和建设，对于学生来说有一定难度，但是通过实例的讲解，帮助学生们更快的上手，

效果非常显著。

-29-