HTML和XHTML的基础知识讲述.doc

ASP动态网页设计(第2版) 项目二 HTML与XHTML基础  PAGE 34  PAGE 35 项目二 HTML与XHTML基础 【学习目标】 掌握HTML文件结构 掌握HTML常用的标记 理解Web标准 了解HTML到XHTML的升级 【工作任务】 学习常用的HTML标记 用HTML代码编写简单网页 升级HTML到XHTML 打开一个网页，查看它的源代码，就会看到一些有规律的英文代码。这些代码就是超文本标记语言(Hypertext Markup Language，HTML)。“超文本”就是指页面内可以包含图片、链接甚至音乐、程序等非文字的元素，“标记”就是说它不是程序语言，只是由文字及标记符号组合而成。 一个网页无论看上去多么五花八门、生动活泼，其实最本质的东西，就是由这些看着十分单调的HTML语言组成的，浏览器或者其他可以浏览网页的设备将这些HTML语言“翻译”过来，并按照定义的格式显示出来，转化成最终看到的网页。 现在有很多功能强大的网页编辑制作工具，如Dreamweaver等，它们使网页制作变得很简单。但是当制作者需要一些特殊的版式或者被一个莫名其妙的现象困扰的时候，最简单的解决方法，就是直接面对HTML源代码。对于要写脚本语言程序或者服务器端脚本编程的人来说，就更要了解HTML语言了。 2.1 任务1 - HTML基本用法 HTML是Hypertext Markup Language的缩写，即超文本标记语言，是一种用来制作超文本文档的简单标记语言。目前的版本是HTML 4.0。用HTML编写的超文本文档称为HTML文档，它能独立于各种操作系统平台(如Unix、Windows等)。使用HTML语言描述的文件，需要通过WWW浏览器显示出效果。 HTML是一种纯文本语言，也就是说，HTML代码在运行时不用事先编译为二进制代码，而是直接通过网页浏览器逐行解释执行。所以，用一般的文本编辑器就可以编写HTML代码，然后只需把代码文件保存为.htm或.html格式即可。 2.1.1 HTML文档的基本结构 用HTML语言创建的文档称为HTML文档，由按照一定规则组合起来的各种标记组成。在IE浏览器中运行文件2-1.html，用记事本查看其源文件，如图2-1所示。 图2-1 HTML文件构成 由图2-1可知，HTML文档的基本特征如下。 (1) 用尖括号“”和“”括起来的部分称为标记，每个标记都必须有一个标记名称，来作为该标记的唯一标识，如html中的html。绝大部分标记都有其相关的属性及属性值，如body bgcolor=“#cccccc”，其中bgcolor是标记body的一个属性，#cccccc是bgcolor的取值。取值可以用引号括起来，也可以不用，标记的属性通常都有一个默认值，如bgcolor的默认值是#ffffff。 (2) HTML标记都是用尖括号“”和“”括起来的，大多数标记是成对出现和使用的，有开始标记和对应的结束标记，结束标记多一根斜杠。例如： title文档标题文字/title (3) 很多标记还有自己的属性，利用这些属性，可以做进一步的详细设置。其语法格式为： 标记名 name1=value1 name2=value2....../标记名 各属性项间用空格分隔，属性值可用双引号或单引号，也可以不用引号。例如控制文本的标记为font，该标记有face、size、color属性，分别用于控制字体名、字号和字体颜色，用法为： font face=宋体 size=4 color=#ff0000样本文字/font (4) HTML标记可以嵌套使用，实现从不同角度对文本进行格式控制。各标记书写的先后顺序没有特别要求，只要不发生交叉嵌套就行。以下3行效果等价： bdiv align=centerfont color=#ff0000文字/font/div/b div align=centerbfont color=#ff0000文字/font/b/div font color=#ff0000bdiv align=center文字/div/b/font (5) 有些标记是单独使用的，没有对应的结束标记。例如换行的标记br和画水平线的标记hr。 (6) HTML标签不区分大小写，例如p意思和P是一样的。 注意：在XHTML中规定标签必须为小写，这将在后面的任务中讲解。 由图3-1还可以看出，HTML文档一般由3个部分构成，分别如下。 (1) html/html html标记用于定义网页文件的开始，对应的结束标记/html则定义网页的结束。 (2) head/head 该组标记用于定义网页的头部。在网页的头部可以用title/title标记来定义网页的标题，可以用meta标记定义与文档相关的信息，可