《Web程序设计(第二版)》
相关主题
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
HTML 4.0，W3C于1997年12月18日将其列为推荐版本，第二个稍作修正的 HTML 4.0 版本与1998年12月24日发布。
HTML4.0中最重要的特征是引入了样式表CSS技术。
HTML 4.01，W3C于1999年12月24日将其列为推荐版本，是HTML 4.0的升级 版本，它对原版本做出了部分修正。
使用IntelliSense 技术 查看标记属性
段落标记、换行标记
段落标记
<p>…</p>，标记一个段落，输出位置转到下一行开始，并增加一个空 行。
标记属性
水平线标记<hr>
段落标记
水平线标记<hr> ，插入一条水平线。 单标记。
标记属性
width
代码：
<hr width="200" align="center" >
HTML文档结构
<html> <head>
头部信息 </head> <body>
文档主体 （语句部分） </body> </html>
文件头标记及子标记
文件头
<head>…</head>标记对之间的部分称为文件头
子标记
<title></title>标记 <meta>标记 <base>标记 <link>标记 背景音乐标记<bgsound>
文本格式标记
字体标记<font>…</font>
常用的属性有face、size和color，分别设置字体、文字大小和颜色。
粗体、斜体和下划线标记
<b>…</b>、<i>…</i>、<u>…</u>
字体放大、缩小、上标和下标显示标记
< big>…</big>、< small>…</small>、<sub>…</sub>、 <sup>…</sup>
字体标记<font>…</font> 粗体、斜体和下划线标记
图像标记<img> 超链接标记<a>…</a> 影像地图标记<map> </map> 走马灯标记<marquee>…</marquee> 注释标记
标题标记
标题标记
<h1></h1>…<h6></h6>
标记属性
Align…
<meta name="robots" content="none">
<base>标记
<base>标记
<base>标记定义了文档的基础URL地址，在文档中所有的相对地址形 式的URL都是相对于这里定义的URL而言的 。
文档中的<base>标记不能多于一个，必须放于头部，并且应该在任何 包含URL地址的语句之前
window-target（显示窗口的设定），强制页面在当前窗口以独立页面显示
<meta http-equiv="window-target" content="_top">，可以用来防止别人在框架 里调用自己的页面
<meta>标记--name属性
name属性
主要用于描述网页，与之对应的属性值为content，content中的内容主要是便 于搜索引擎查找信息和分类信息用的。
的标记
标准通用标记语言SGML
SGML（Standard Generalized Markup Language，SGML）是一 个用来定义在电子表格中如何对文件的结构和内容进行描述的国际标 准（ISO-8879） ，1969年，IBM
SGML设计的非常复杂，SGML的正式规范达500多页 意义
<base target="_blank"> 表明页面上所有的链接都在新窗口打开
<link>标记
<link>标记
<link>标记定义了文档之间的包含 。 在HTML的头部可以包含任意数量的<link>标记
<link>标记属性
type，用于指定被包含的文件类型。例如，text/css是指包含一 个层叠样式表文件。
可扩展HTML规范XHTML
HTML 的缺陷
HTML的标记固定，HTML只是一种表现技术，不能表达语义 不能适应现在越来越多的网络设备和应用的需要，比如手机、
PDA、信息家电都不能直接显示HTML 。 由于HTML代码不规范、臃肿，浏览器需要足够智能和庞大才
能够正确显示HTML 数据与表现混杂，页面要改变显示，就必须重新制作HTML
SGML定义了标记语言的基本概念，奠定了标记语言的技术基础
超文本标记语言HTML
HTML 的诞生
超文本标记语言HTML起源于通用标准标记语言SGML 由世界上最大的粒子物理研究实验室欧洲核子研究中心CERN（the
European Organization for Nuclear Research）于1991年首先提出。
一般属性 事件属性
<body>标记属性-1
<body>标记一般属性
<body>标记属性-2
<body>标记事件属性
一个简单HTML文档示例
文本编辑器
一个简单HTML文档示例（Cont1）
使用FrontPage编辑
一个简单HTML文档示例（Cont2）
在浏览器中打开
文档内容常用标记
标题、段落标记 文本格式标记
与Web开发相关的技术或者说开发模式 ，不是规范 涉及的内容
HTML 4.0 规范 客户端脚本语言CSSL（Clent-Side Scripting Language） 文档对象模型DOM（Document Object Model） ，它将网页中的内容抽象
成对象，每个对象拥有各自的属性(Properties)、方法(Method)和事件 (Events)，可以通过上面的客户端脚本语言编程控制 层叠样式表单CSS 技术
标准通用标记语言SGML 超文本标记语言HTML 可扩展HTML规范XHTML 可扩展标记语言XML DHTML和SHTML技术
标准通用标记语言SGML
标记语言的概念
广义上，标记语言可以理解为对内容进行描述的规范或标准。 例如，在出版印刷行业，编辑人员在进行文档内容编辑时对内容所做
W3C 不再继续开发HTML 可扩展HTML
W3C制定 ，2000年1月20 日发布XHTML 1.0 。 HTML向XML过度的一个桥梁 2002年8月5日，发布XHTML 2.0的第一个工作草案。
可扩展标记语言XML
可扩展标记语言XML
XML（eXtensible Markup Language） ，1998年2月10日，XML工作组正 式向W3C提交了XML的最终推荐标准，这就是XML 1.0标准。
pragma（Cache模式），禁止浏览器从本地计算机的缓存中访问页面内容
<meta http-equiv=“pragma” content=“no-cache”> ，该种设定访问者将无法使 用脱机浏览功能
refresh（刷新），自动刷新并指向新页面。
<meta http-equiv="refresh" content="60; url=new.htm">
content-type（显示字符集的设定），设定页面使用的字符集。
<meta http-equiv="content-type" content="text/html; charset=gb2312">
expires（期限），用于设定网页的到期时间
<meta http-equiv="expires" content="Thur, 8 May 2008 18:18:18 GMT">
<meta name="description" content="This page is about E-learning etc.">
author（作者），标注网页的作者
<meta name="author" content="brion@mail.abc.com">
robots（机器人向导），robots用来告诉搜索机器人需要索引的页面有哪些。
<base>标记属性
href属性 ，指定了文档的基础URL地址，该属性在<base>标记中是必 须存在的 。
<base href = "">
target属性 target属性同框架一起使用，它定义了当文档中的链接被点 击后，在哪一个框架中展开页面。
常用的target的属性值有：_blank ，_self ，_parent ，_top
SHTML技术
SHTML不是一种HTML规范，而是一种网站设计、开发与维护技术 是一种Web服务器 API，其指令可以在Web服务端运行，以产生动态的
html，是一种类似于ASP的基于服务器的网页制作技术
3.2 超文本标记语言HTML
HTML标记语法和文档结构 文件头标记及子标记 文件体标记及其属性 文档内容常用标记 表格（table） 表单（form） 层次块标记 对象和脚本程序标记 层叠样式表CSS技术 帧（frame）
<meta name="参数" content="具体的参数值">
name属性参数值
keywords（关键字），keywords用来告诉搜索引擎该网页的关键字是什么 。
<meta name="keywords" content="E-learning,ontology">
description（网站内容描述），description用来告诉搜索引擎网站的主要内 容
目录
第 1 章 Web程序设计基础 第 2 章 Web程序及运行环境 第 3 章 标记语言HTML规范
第 5 章 客户端编程 第 6 章 服务端编程
第 3 章 标记语言HTML规范
3.1 标记语言及其发展 3.2 超文本标记语言HTML 3.3 网页设计基础 3.4 使用Front Page
3.1 标记语言及其发展
<title></title>标记
<title></title>标记
用于标识网页主题，其中的内容将在浏览器的标题栏中显示，不出现在页面内
举例
<title>计算机基础网络教学平台GSL3.0ຫໍສະໝຸດ Baidu/title>
<meta>标记
<meta>标记为单标记，没有尾标记。
为单标记，没有尾标记。
<meta>标记属性
<body>标记
在<body>…</body>标记对之间的部分称为html文 档的文件体。文件体中描述的是浏览器中显示的内容。
在<body>…</body>标记对之间可包含<p>…</p>、 <img>、<a>…</a>等标记，它们所定义的文本、图 像以及超链接等将会在浏览器中显示。
<body>标记属性
HTML规范
标记
HTML主要版本和发布时间
HTML 2.0， Internet工程任务组中的HTML工作组开发完成了HTML 2.0，于 1996年发布
HTML3.2，W3C于1997年1月14日将其列为推荐版本，在HTML2.0标准中添 加了诸如：字体、表格、Java程序、浮动、上标、下标等特征
href，指向被包含资源的url地址 。 title，一个字符串，用于描述该链接关系。 rel，定义HTML文档和所要包含资源之间的链接关系
例如：<link type="text/css" rel="stylesheet" href="mystyle.css">
文件体标记<body></body>
http-equiv属性 name属性
<meta>标记--http-equiv属性
http-equiv属性
http-equiv相当于HTTP的文件头，向浏览器传回信息，以正确显示网页内容 <meta http-equiv="参数" content="参数变量值">
http-equiv属性参数值
核心思想
实现数据和显示的分离
XML地构成
DTD、XML架构等基本要素 元规范
相应规范
可扩展样式语言XSL XML路径语言XPath XML查询语言Xquery 可扩展连接语言XLL 及XML文档对象模型DOM 简单应用程序接口SAX 等
DHTML和SHTML技术
DHTML技术
HTML标记语法
HTML标记语法
标记（Tag）
标记由封装在小于号（<）和大于号（>）构成的一对尖括号之中 一般形式：<标记>文档内容</标记> 例如：<a>link text</a>
标记类型与标记属性
单标记 双标记
标记属性
<标记 属性1="属性值" 属性2="属性值" 属性3="属性值"…> 例如：<hr size="3" align="center" width="50%">
HTML4.0中最重要的特征是引入了样式表CSS技术。
HTML 4.01，W3C于1999年12月24日将其列为推荐版本，是HTML 4.0的升级 版本，它对原版本做出了部分修正。
使用IntelliSense 技术 查看标记属性
段落标记、换行标记
段落标记
<p>…</p>，标记一个段落，输出位置转到下一行开始，并增加一个空 行。
标记属性
水平线标记<hr>
段落标记
水平线标记<hr> ，插入一条水平线。 单标记。
标记属性
width
代码：
<hr width="200" align="center" >
HTML文档结构
<html> <head>
头部信息 </head> <body>
文档主体 （语句部分） </body> </html>
文件头标记及子标记
文件头
<head>…</head>标记对之间的部分称为文件头
子标记
<title></title>标记 <meta>标记 <base>标记 <link>标记 背景音乐标记<bgsound>
文本格式标记
字体标记<font>…</font>
常用的属性有face、size和color，分别设置字体、文字大小和颜色。
粗体、斜体和下划线标记
<b>…</b>、<i>…</i>、<u>…</u>
字体放大、缩小、上标和下标显示标记
< big>…</big>、< small>…</small>、<sub>…</sub>、 <sup>…</sup>
字体标记<font>…</font> 粗体、斜体和下划线标记
图像标记<img> 超链接标记<a>…</a> 影像地图标记<map> </map> 走马灯标记<marquee>…</marquee> 注释标记
标题标记
标题标记
<h1></h1>…<h6></h6>
标记属性
Align…
<meta name="robots" content="none">
<base>标记
<base>标记
<base>标记定义了文档的基础URL地址，在文档中所有的相对地址形 式的URL都是相对于这里定义的URL而言的 。
文档中的<base>标记不能多于一个，必须放于头部，并且应该在任何 包含URL地址的语句之前
window-target（显示窗口的设定），强制页面在当前窗口以独立页面显示
<meta http-equiv="window-target" content="_top">，可以用来防止别人在框架 里调用自己的页面
<meta>标记--name属性
name属性
主要用于描述网页，与之对应的属性值为content，content中的内容主要是便 于搜索引擎查找信息和分类信息用的。
的标记
标准通用标记语言SGML
SGML（Standard Generalized Markup Language，SGML）是一 个用来定义在电子表格中如何对文件的结构和内容进行描述的国际标 准（ISO-8879） ，1969年，IBM
SGML设计的非常复杂，SGML的正式规范达500多页 意义
<base target="_blank"> 表明页面上所有的链接都在新窗口打开
<link>标记
<link>标记
<link>标记定义了文档之间的包含 。 在HTML的头部可以包含任意数量的<link>标记
<link>标记属性
type，用于指定被包含的文件类型。例如，text/css是指包含一 个层叠样式表文件。
可扩展HTML规范XHTML
HTML 的缺陷
HTML的标记固定，HTML只是一种表现技术，不能表达语义 不能适应现在越来越多的网络设备和应用的需要，比如手机、
PDA、信息家电都不能直接显示HTML 。 由于HTML代码不规范、臃肿，浏览器需要足够智能和庞大才
能够正确显示HTML 数据与表现混杂，页面要改变显示，就必须重新制作HTML
SGML定义了标记语言的基本概念，奠定了标记语言的技术基础
超文本标记语言HTML
HTML 的诞生
超文本标记语言HTML起源于通用标准标记语言SGML 由世界上最大的粒子物理研究实验室欧洲核子研究中心CERN（the
European Organization for Nuclear Research）于1991年首先提出。
一般属性 事件属性
<body>标记属性-1
<body>标记一般属性
<body>标记属性-2
<body>标记事件属性
一个简单HTML文档示例
文本编辑器
一个简单HTML文档示例（Cont1）
使用FrontPage编辑
一个简单HTML文档示例（Cont2）
在浏览器中打开
文档内容常用标记
标题、段落标记 文本格式标记
与Web开发相关的技术或者说开发模式 ，不是规范 涉及的内容
HTML 4.0 规范 客户端脚本语言CSSL（Clent-Side Scripting Language） 文档对象模型DOM（Document Object Model） ，它将网页中的内容抽象
成对象，每个对象拥有各自的属性(Properties)、方法(Method)和事件 (Events)，可以通过上面的客户端脚本语言编程控制 层叠样式表单CSS 技术
标准通用标记语言SGML 超文本标记语言HTML 可扩展HTML规范XHTML 可扩展标记语言XML DHTML和SHTML技术
标准通用标记语言SGML
标记语言的概念
广义上，标记语言可以理解为对内容进行描述的规范或标准。 例如，在出版印刷行业，编辑人员在进行文档内容编辑时对内容所做
W3C 不再继续开发HTML 可扩展HTML
W3C制定 ，2000年1月20 日发布XHTML 1.0 。 HTML向XML过度的一个桥梁 2002年8月5日，发布XHTML 2.0的第一个工作草案。
可扩展标记语言XML
可扩展标记语言XML
XML（eXtensible Markup Language） ，1998年2月10日，XML工作组正 式向W3C提交了XML的最终推荐标准，这就是XML 1.0标准。
pragma（Cache模式），禁止浏览器从本地计算机的缓存中访问页面内容
<meta http-equiv=“pragma” content=“no-cache”> ，该种设定访问者将无法使 用脱机浏览功能
refresh（刷新），自动刷新并指向新页面。
<meta http-equiv="refresh" content="60; url=new.htm">
content-type（显示字符集的设定），设定页面使用的字符集。
<meta http-equiv="content-type" content="text/html; charset=gb2312">
expires（期限），用于设定网页的到期时间
<meta http-equiv="expires" content="Thur, 8 May 2008 18:18:18 GMT">
<meta name="description" content="This page is about E-learning etc.">
author（作者），标注网页的作者
<meta name="author" content="brion@mail.abc.com">
robots（机器人向导），robots用来告诉搜索机器人需要索引的页面有哪些。
<base>标记属性
href属性 ，指定了文档的基础URL地址，该属性在<base>标记中是必 须存在的 。
<base href = "">
target属性 target属性同框架一起使用，它定义了当文档中的链接被点 击后，在哪一个框架中展开页面。
常用的target的属性值有：_blank ，_self ，_parent ，_top
SHTML技术
SHTML不是一种HTML规范，而是一种网站设计、开发与维护技术 是一种Web服务器 API，其指令可以在Web服务端运行，以产生动态的
html，是一种类似于ASP的基于服务器的网页制作技术
3.2 超文本标记语言HTML
HTML标记语法和文档结构 文件头标记及子标记 文件体标记及其属性 文档内容常用标记 表格（table） 表单（form） 层次块标记 对象和脚本程序标记 层叠样式表CSS技术 帧（frame）
<meta name="参数" content="具体的参数值">
name属性参数值
keywords（关键字），keywords用来告诉搜索引擎该网页的关键字是什么 。
<meta name="keywords" content="E-learning,ontology">
description（网站内容描述），description用来告诉搜索引擎网站的主要内 容
目录
第 1 章 Web程序设计基础 第 2 章 Web程序及运行环境 第 3 章 标记语言HTML规范
第 5 章 客户端编程 第 6 章 服务端编程
第 3 章 标记语言HTML规范
3.1 标记语言及其发展 3.2 超文本标记语言HTML 3.3 网页设计基础 3.4 使用Front Page
3.1 标记语言及其发展
<title></title>标记
<title></title>标记
用于标识网页主题，其中的内容将在浏览器的标题栏中显示，不出现在页面内
举例
<title>计算机基础网络教学平台GSL3.0ຫໍສະໝຸດ Baidu/title>
<meta>标记
<meta>标记为单标记，没有尾标记。
为单标记，没有尾标记。
<meta>标记属性
<body>标记
在<body>…</body>标记对之间的部分称为html文 档的文件体。文件体中描述的是浏览器中显示的内容。
在<body>…</body>标记对之间可包含<p>…</p>、 <img>、<a>…</a>等标记，它们所定义的文本、图 像以及超链接等将会在浏览器中显示。
<body>标记属性
HTML规范
标记
HTML主要版本和发布时间
HTML 2.0， Internet工程任务组中的HTML工作组开发完成了HTML 2.0，于 1996年发布
HTML3.2，W3C于1997年1月14日将其列为推荐版本，在HTML2.0标准中添 加了诸如：字体、表格、Java程序、浮动、上标、下标等特征
href，指向被包含资源的url地址 。 title，一个字符串，用于描述该链接关系。 rel，定义HTML文档和所要包含资源之间的链接关系
例如：<link type="text/css" rel="stylesheet" href="mystyle.css">
文件体标记<body></body>
http-equiv属性 name属性
<meta>标记--http-equiv属性
http-equiv属性
http-equiv相当于HTTP的文件头，向浏览器传回信息，以正确显示网页内容 <meta http-equiv="参数" content="参数变量值">
http-equiv属性参数值
核心思想
实现数据和显示的分离
XML地构成
DTD、XML架构等基本要素 元规范
相应规范
可扩展样式语言XSL XML路径语言XPath XML查询语言Xquery 可扩展连接语言XLL 及XML文档对象模型DOM 简单应用程序接口SAX 等
DHTML和SHTML技术
DHTML技术
HTML标记语法
HTML标记语法
标记（Tag）
标记由封装在小于号（<）和大于号（>）构成的一对尖括号之中 一般形式：<标记>文档内容</标记> 例如：<a>link text</a>
标记类型与标记属性
单标记 双标记
标记属性
<标记 属性1="属性值" 属性2="属性值" 属性3="属性值"…> 例如：<hr size="3" align="center" width="50%">