大工12秋《Web技术》辅导资料五.doc

大连理工大学网络教育学院Web技术辅导资料五主 题：第三章 万维网和HTML（课件）学习时间：2012年10月29日11月4日内 容：我们这周主要学习Web技术这门课程第3章关于万维网和HTML介绍的相关内容。希望通过下面的内容能使同学们对此部分的相关知识有一个详细的了解。知识要点：1、 万维网的概念2、 HTML语言的特点3、 HTML语言的结构4、 HTML语言的标签功能重点难点：1、 HTML语言的结构2、 HTML语言的标签功能一、 万维网万维网联盟（World Wide Web Consortium，W3C）是一个国际标准化组织，其主要目标是为万维网的发展开发通用的协议和标准。HTTP和HTML协议就是W3C针对WWW制定的两个非常重要的协议。标准通用标记语言SGML是一个用来定义在电子表格中如何对文件的结构和内容进行描述的国际标准。为了满足各种不同的页面表达需要，SGML设计得非常复杂，SGML的正式规范多达500多页。因此使用起来很不方便，使它未能得到普及和大规模的应用。虽然SGML没有HTML应用广泛，但是SGML定义了标记语言的基本概念，奠定了标记语言的技术基础。二、 超文本标记语言HTMLHTML是一种用来制作超文本文档的简单标记语言包含了文档数据和显示格式两部分，其中文档数据是显示在WWW浏览器中的数据内容，显示格式则规定了这些内容在浏览器中以何种格式、样子呈现给用户。 HTML语言通过利用各种标记来标识文档的结构以及标识超链接的信息。虽然HTML语言描述了文档的结构格式，但并不能精确地定义文档信息必须如何显示和排列，而只是建议Web浏览器应该如何显示和排列这些信息，最终在用户面前的显示结果取决于Web浏览器本身的显示风格及其对标记的解释能力。这就是为什么同一文档在不同的浏览器中展示的效果会不一样的原因。HTML文件是一种纯文本文件，通常它带有.htm或.html的文件扩展名。可以使用任何文本编辑器，然后将文件保存为.htm格式，或者存为文本格式。HTML标记语法和文档结构HTML文档时纯ASCII码的文本文件，由“显示内容”和“控制语句”两部分组成。控制语句描述了显示内容以何种形式在浏览器中显示，并负责客户端与服务器端之间的信息交换。标记封装在小于号和大于号构成一对尖括号之中，标记一般分首标记和尾标记，它们成对出现。首标记用于开启某种形式的显示，尾标记含“/”以同首标记区分，用于关闭首标记开启的功能。标记类型与标记属性标记分为“单标记”和“双标记”两种类型。“单标记”是指只需单独使用就能完整地表达意思的一类标记，这类标记的语法是：常用的单标记有表示换行，代表一条水平线等。另一类标记称为“双标记”，它由“首标记”和“尾标记”两部分构成，必须成对使用，其中首标记告诉Web浏览器从此开始执行该标记所表示的功能，而尾标记告诉Web浏览器在这里结束该功能。首标记前加一个（/）即成为尾标记。这类标记的语法是：文档内容其中“文档内容”部分就是要被这对标记施加作用的部分。许多单标记和双标记的首标记内可以包含一些属性，其语法是：各属性之间无先后次序，属性之间用空格分开。属性也可以省略，属性值两侧的双引号(“)可以省略不写。文档结构一个HTML文档以标记开始，以标记结束，表示这对标记间的内容是HTML文档。HTML文档的中间又分成文件头和文件体两个部分，由相应的标记来区分。HTML文档总体结构如下： 头部信息 文档主体 （语句部分）其中，之间是文件头，如文档总标题等，若不需头部信息则可省略此标记。之间是文件体，表示正文内容的开始，标记一般不能省略。在一个HTML文档中，标记用于HTML文档的开始，用来标识HTML文档的开始；标记放在HTML文档的最后，用来标识一个HTML文档的结束。因为.htm或.html文件被Web浏览器默认为是HTML文档，有些HTML文档可以省略和标记。文件头及相关标记在HTML文档中，标记对之间的部分称为文件头。文件头的内容主要用于定义HTML文档在WWW网中的情况，其内容不在浏览器中显示。用户可以省略的首尾标记，而直接使用有关的标记语句。文件头中主要的标记对有、等。1、标记标识网页主题，其中的内容将在浏览器的标题栏中显示，不出现在页面内。例如：欢迎光临GSL网站2、标记它是HTML文档文件头标记内的一个辅助性标记，往往不能引起用户的注意，但是它对于网页是否能够被搜索引擎检索以及是否能提高网页在搜索列表的排序起着关键的作用，是一个非常有价值的标记。标记为单标记，没有尾标记。标记共有两个属性，分别是http-equiv属性和name属性，不同的属性又有不同的参数值，这些不同的参数值实现了不同的网页功能。Name属性Name属性主要用于描述网页，与之对应的属性值为content，content中的内容主要是便于搜索引擎查找信息和分类信息用的。Meta标记的name属性的语法格式：Name属性主要有以下几种参数值。keywords用来告诉搜索引擎该网页的关键字是什么。description用来告诉搜索引擎网站的主要内容。robots用来告诉搜索引擎机器人需要索引的页面有哪些。author标注网页的作者。http-equiv属性http-equiv，相当于HTTP的文件头作用，它可以向浏览器传回一些有用的信息，以帮助正确显示网页内容，与之对应的属性值为content，content中的内容就是各个参数的变量值。Meta标记的http-equiv属性语法格式如下：http-equiv属性主要有以下几种参数。content-type，设置页面使用的字符集。expires，用于设置网页的到期时间，一旦网页过期，必须到服务器上重新下载。pragma，禁止浏览器从本地计算机的缓存中访问页面内容。refresh，自动刷新并指向新页面。set-cookie，如果网页过期，那么存盘的cookie将被删除。window-target，强制页面在当前窗口以独立页面显示。3、标记标记定义了文档的基础URL地址，在文档所有相对地址形式的URL都是相对于这里定义的URL而言的。一篇文档中的标记不能多于一个，必须放于头部，并且应该在任何包含URL地址的语句之前。标记包含如下属性：href属性指定了文档的基础URL地址，该属性在标记中是必须存在的。target属性同框架一起使用，它定义了当文档中的连接被单击后，在哪一个框架中展开页面。如果文档中超级链接没有明确指定展开页面的目标框架集，则使用这里定义的地址代替。4、标记标记定义了文档之间的包含。在HTML的头部可以包含任意数量的标记。下面是一些常用的属性：href指向链接资源所在的URL，其中URL是链接的地址。title属性值为一个字符串，用于描述该链接关系。rel属性定义了文档和所链接资源的链接关系，一般形式是rel=linktype。5、标记可以让某些Web Server搜索网页内的关键字，若Web Server提供这样的搜索功能，客户端浏览器也支持搜索功能，在载入网页时会看到一个简单的搜索。6、注释标记注释标记一般的形式是，用于在HTML文档中书写说明性文字，内容在浏览器中不显示。三、 文件体及相关标记属性在标记对之间的部分称为HTML文档的文件体。文件体中描述的是浏览器中显示的内容。文件体由一系列的控制语句构成，在标记对之间可包含、等标记，它们所定义的文本、图像等将会在浏览器中显示。四、 文档内容标记HTML文档是由一系列的标记语句组成的，下面介绍每种文档标记的格式和功能。1、 标题、段落标记在标记对之间的内容将在浏览器中显示，对显示内容的格式指定是通过各种格式标记来定义的。常用的格式标记包括如下种类。标题标记 一级到六级标题标记，对应的字体逐渐缩小。段落标记标记一个段落，输出位置转到下一行开始，并增加一个空行。回车换行标记 将输出位置转到下一行的开始。水平线标记插入一条水平线。预排版文本标记预排格式文本标记可以产生固定宽度的字体。块引用标记，主要用于在文档中标记一段引用文字，它所包含的文字相对于标记外的文字往左缩进两个字符的距离。2、 文本格式标记字体标记、标记、标记、标记3、 图像标记标记用以插入图像及设置图像属性，丰富多彩的图像可以提高网页的吸引力。4、 超链接标记超链接标记可以定义超文本链接、图像链接等。5、 影像地图标记、一个图像映射由一些区域组成，每个区域对应于一个相关联的超级链接，当单击其中某个区域时就转到相应的链接。6、 层次块标记为了更好地实现元素的精确定位，动态HTML给HTML增加了网页中层和位置的概念。对于两种主流的浏览器，对层的支持是不一样的。五、 列表列表是HTML文档内容的一种重要表现形式，特别适合罗列有关信息的内容，具有清晰明了，易于阅读，操作性强的特点。列表可以嵌套，显示时按层次缩进，清晰明了。HTML中的列表分为三种。1、 不编号列表，标记是2、 编号式列表，标记是3、 定义式列表，标记是六、 表格表格式网页制作中安排中安排布局最好的工具，因为表格不但可以很好地安排文本或图像的显示位置，而且还可以任意进行背景和前景颜色的设置。七、 表单表单在Web网页中用来供访问者填写信息，从而获得用户信息，使网页具有交互能力。表单和Windows的对话框类似，是由若干控件组成的，用于实现和用户的交互。当用户填写完信息后做提交操作，表单的内容将从客户端的浏览器传送到服务器端上，由web服务器上的服务器脚本程序处理。八、 帧帧可以用来将浏览器窗口划分为多个区域，每个子窗口中装载一个HTML文件。即每个HTML文件占据一个帧，而多个帧可以同时显示在同一个浏览器窗口中，这样的Web页面称为框架网页。九、 层叠样式表CSS技术层叠样式表技术可以有效地对页面的布局、字体、颜色、背景和其他效果实现更加精确的控制，从而控制整个页面的风格。样式单放在页面中，通过浏览器解释执行。例