先了解一下XHTML

阅读量：5979 次

发布时间：2019-06-20

本文共 10976 字，大约阅读时间需要 36 分钟。

XHTML 是更严格更纯净的 HTML 代码。

XHTML 是什么？

XHTML 指可扩展超文本标签语言（EXtensible HyperText Markup Language）。

XHTML 的目标是取代 HTML。

XHTML 与 HTML 4.01 几乎是相同的。

XHTML 是更严格更纯净的 HTML 版本。

XHTML 是作为一种 XML 应用被重新定义的 HTML。

XHTML 是一个 W3C 标准。

之前应该掌握的知识

在继续学习本教程之前，你应该对下列知识有一个基本的理解：

HTML

基本的网站建设知识。

XHTML 是一个 W3C 标准

XHTML 于2000年的1月26日成为 W3C 标准。

W3C 将 XHTML 定义为最新的HTML版本。XHTML 将逐渐取代 HTML。

所有新的浏览器都支持 XHTML

XHTML 与 HTML 4.01 兼容。

所有新的浏览器都支持 XHTML。

XHTML 是 HTML 与 XML（扩展标记语言）的结合物。

XHTML 包含了所有与 XML 语法结合的 HTML 4.01 元素。

为什么要使用XHTML？

我们认为万维网上的许多页面都包含着糟糕的 HTML 代码。

下面的 HTML 代码仍然可以工作得很好，即使它没有遵守 HTML 规则：

This is bad HTMLBad HTML

XML 是一种标记化语言，其中所有的东西都要被正确的标记，以产生形式良好的文档。

XML 用来描述数据，而 HTML 则用来显示数据。

今天的市场中存在着不同的浏览器技术，某些浏览器运行在计算机中，某些浏览器则运行在移动电话和手持设备上。而后者没有能力和手段来解释糟糕的标记语言。因此，通过把 HTML 和 XML 各自的长处加以结合，我们得到了在现在和未来都能派上用场的标记语言 - XHTML。

XHTML 可以被所有的支持 XML 的设备读取，同时在其余的浏览器升级至支持 XML 之前，XHTML 使我们有能力编写出拥有良好结构的文档，这些文档可以很好地工作于所有的浏览器，并且可以向后兼容。

如何为 XHTML 做好准备

XHTML 与 HTML 4.01 标准没有太多的不同。

所以将你的代码升级至 4.01 是个不错的开始。我们的完整的《》会帮助你做到这一点。

另外，你应该马上使用小写字母编写HTML代码，同时绝不要养成忽略类似 标签的坏习惯。

祝您可以愉快地编码！

最主要的不同：

XHTML 元素必须被正确地嵌套。

XHTML 元素必须被关闭。

标签名必须用小写字母。

XHTML 文档必须拥有根元素。

元素必须被正确地嵌套

在 HTML 中，某些元素可以像这样彼此不正确地嵌套：

This text is bold and italic

在 XHTML 中，所有的元素必须像这样彼此正确地嵌套：

This text is bold and italic

提示：在嵌套列表中一个容易犯的错误，是忘记内部列表必须位于 li 元素中，就像下面这样：

这是错误的：


       
      Coffee
  
      Tea    
             
        Black tea
      
        Green tea
    
       
  
      Milk

这是正确的：


       
      Coffee
  
      Tea    
             
        Black tea
      
        Green tea
    
       
  
  
      Milk

注意：在正确代码的例子中，我们在 </ul> 之后插入了一个 </li> 标签。

XHTML 元素必须被关闭

非空标签必须使用结束标签。

这是错误的：

This is a paragraph

This is another paragraph

这是正确的：

This is a paragraph

This is another paragraph

空标签也必须被关闭

空标签也必须使用结束标签，或者其开始标签必须使用/>结尾。

这是错误的：

A break: 
A horizontal rule: 
      
An image:

这是正确的：

A break: 
A horizontal rule: 
      
An image:

XHTML 元素必须小写

XHTML 规范定义：标签名和属性对大小写敏感。

这是错误的：

This is a paragraph

这是正确的：

This is a paragraph

XHTML 文档必须拥有一个根元素

所有的 XHTML 元素必须被嵌套于 <html> 根元素中。其余所有的元素均可有子元素。子元素必须是成对的且被嵌套在其父元素之中。基本的文档结构如下：

 ...  ...

编写 XHTML 代码需要纯净的 HTML 语法。

属性名称必须小写

这是错误的：

这是正确的：

属性值必须加引号

这是错误的：

这是正确的：

属性不能简写

这是错误的：

这是正确的：

下面是一个 HTML 的简写属性列表，以及在 XHTML 中的改写：

HTML	XHTML
compact	compact="compact"
checked	checked="checked"
declare	declare="declare"
readonly	readonly="readonly"
disabled	disabled="disabled"
selected	selected="selected"
defer	defer="defer"
ismap	ismap="ismap"
nohref	nohref="nohref"
noshade	noshade="noshade"
nowrap	nowrap="nowrap"
multiple	multiple="multiple"
noresize	noresize="noresize"

用 id 属性代替 name 属性

HTML 4.01 针对下列元素定义 name 属性：a, applet, frame, iframe, img, 和map。

在 XHTML 中不鼓励使用 name 属性，应该使用 id 取而代之。

这是错误的：

这是正确的：

重要的兼容性提示：

你应该在 "/" 符号前添加一个额外的空格，以使你的 XHTML 与当今的浏览器相兼容。

语言属性（lang）

lang 属性应用于几乎所有的 XHTML 元素。它定义元素内部的内容的所用语言的类型。

如果在某元素中使用 lang 属性，就必须添加额外的 xml:lang，像这样：


     
      Heia Norge!

强制使用的 XHTML 元素

所有 XHTML 文档必须进行文件类型声明（DOCTYPE declaration）。在 XHTML 文档中必须存在html、head、body元素，而 title 元素必须位于在 head 元素中。

下面是一个最小化的 XHTML 文件模板：

Title goes here

提示：文件类型声明并非 XHTML 文档自身的组成部分。它并不是 XHTML 元素，也没有关闭标签。

提示：在 XHTML 中，<html> 标签内的 xmlns 属性是必需的。然而，即使当 XHTML 文档中没有这个属性时，w3.org 的验证工具也不会提示错误。这是因为，"xmlns=http://www.w3.org/1999/xhtml" 是一个固定的值，即使你没有把它包含在代码中，这个值也会被添加到 <html> 标签中。

XHTML 定义了三种文件类型声明。

使用最普遍的是 XHTML Transitional。

<!DOCTYPE> 是强制使用的。

一个 XHTML 文档有三个主要的部分：

DOCTYPE

Head

Body

基本的文档结构是这样的：

...  ...

在 XHTML 文档中，文档类型声明总是位于首行。

一个 XHTML 的实例

这个一个简单的（最小化的） XHTML 文档：

simple document

a simple paragraph

文档类型声明定义文档的类型：

文档的其余部分类似 HTML：

simple document

a simple paragraph

3种文档类型声明

DTD 规定了使用通用标记语言(SGML)的网页的语法。

诸如 HTML 这样的通用标记语言应该使用 DTD 来规定应用于某种特定文档中的标签的规则，这些规则包括一系列的元素和实体的声明。

在通用标记语言(SGML)的文档类型声明或 DTD 中，XHTML 被详细地进行了描述。

XHTML DTD 使用精确的可被计算机读取的语言来描述合法的 XHTML 标记的语法和句法。

存在三种XHTML文档类型：

STRICT（严格类型）

TRANSITIONAL（过渡类型）

FRAMESET（框架类型）

XHTML 1.0 的三种 XML 文档类型

XHTML 1.0 规定了三种 XML 文档类型，以对应上述三种 DTD。

XHTML 1.0 Strict

在此情况下使用：需要干净的标记，避免表现上的混乱。请与层叠样式表配合使用。

XHTML 1.0 Transitional

在此情况下使用：当需要利用 HTML 在表现上的特性时，并且当需要为那些不支持层叠样式表的浏览器编写 XHTML 时。

XHTML 1.0 Frameset

在此的情况下使用：需要使用HTML框架将浏览器窗口分割为两部分或更多框架时。

如何将你的网站升级至 XHTML ？

为了将站点从 HTML 转换为 XHTML，你首先应该熟悉前几章讲解的 XHTML 语法规则。

下面讲解具体的步骤。

添加文件类型声明

将下面的文件类型声明添加至每页的首行：

注意：本站 (w3school) 使用的是严格的 DTD。不过使用过渡的 DTD 也是个不错的选择，因为对于大多数入门的开发人员来说，严格的 DTD 可能显得“太严格了”。

关于文件类型声明的一点提示

如果你希望将页面验证为正确的 XHTML，那么页面中必须含有文件类型声明。

需要注意的是，根据不同的文件类型声明，新式的浏览器对文档的处理方式也是不同的。如果浏览器读到一个文件类型声明，那么它会按照“恰当”的方式来处理文档。如果没有 DOCTYPE，文档也许会以截然不同的方式显示出来。

小写的标签和属性名

由于 XHTML 对大小写敏感，同时也由于 XHTML 仅接受小写 HTML 标签和属性名，因此你可以执行一个简单的搜索和替换命令将所有的大写标签改为小写。对属性名也要做同样的处理。我们一直在自己的网站使用小写字母，因此基本上，替换功能没有太多地派上用场。

给所有属性加上引号

由于 W3C XHTML 1.0 标准中要求所有的属性值都必须加引号，所以，如果以前没有注意到这个细节，你需要逐页地对网站进行检查。这是一项费时的工作，所以绝不要再忘记为属性值加引号了。

空标签：<hr> , 和 <img>

在 XHTML 中是不允许使用空标签（Empty tags）的。<hr> 和 标签应该被替换为 <hr /> 和 。

这样做又产生了一个新问题，Netscape 会误读 标签。我们不清楚原因所在，不过将之改为 后就没有问题了。认识到这一点后，你需要再一次通过搜索和替换功能对标签进行更改。

其他一些标签（比如 <img> 标签）也会碰到上述同样的问题。不要使用闭合标签来关闭 <img>，而是要在标签的末端添加 / >。

验证站点

做完所有这一切以后，使用下面的链接根据官方的 W3C DTD 对所有修改过的页面进行验证：。接下来，可能还会有少数的错误被发现，逐一对这些错误进行（手工地）修正。我们的经验是，最容易犯的错误是在列表中漏掉了 </li> 标签。

我们应该使用转换工具吗（比方说 TIDY）？对，我们本可以使用 TIDY。

是用来清理HTML代码的免费工具。在处理那些由专门的 HTML 代码编辑器和转换工具生成的难以阅读的HTML代码方面，TIDY 还是做得很棒的。同时，它可以帮助你发现站点中哪些地方需要投入更多精力，使得对于残疾人士，网页具有更强的易用性。

我们没有使用 Tidy 是出于什么原因呢？当我们开始创建这个网站时，我们已经对 XHTML 非常地熟悉。当时我们已经知道使用小写标签以及为属性加引号。所以在网站测试的过程中，我们只是简单地通过 W3C 的 XHTML 验证器进行了测试，并修正了少许的错误。更重要的是，我们已经学到了很多关于编写 Tidy 式 HTML 代码的知识。

XHTML 文档是根据文档类型声明进行验证的。

通过 DTD 验证 XHTML

XHTML 文档是根据文档类型声明（DTD）进行验证的。只有将正确的 DTD 添加到文件的首行，XHTML 文件才会被正确地验证。

严格 DTD 包含没有被反对使用的或不出现在框架结构中的元素和属性：

!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"

过渡 DTD 包含严格 DTD 中的一切，外加那些不赞成使用的元素和属性。

!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"

框架 DTD 包含过渡 DTD 中的一切，外加框架。

!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Frameset//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"

这个一个简单的 XHTML 文档：

simple document

a simple paragraph

使用 W3C 验证器来测试你的 XHTML

在下面的文本框中输入你的网址：

XHTML 模块化模型定义了 XHTML 的模块。

XHTML 模块化的原因

XHTML 是简单而庞大的语言。XHTML 包含了网站开发者需要的大多数功能。

对于某些特殊的用途，XHTML 太大且太复杂，而对于其他的用途，它又太简单了。

通过将 XHTML 分为若干模块，W3C 已经创造出数套小巧且定义良好的 XHTML 元素，这些元素既可被独立应用于简易设备，又可以与其他 XML 标准并入大型且更复杂的应用程序。

通过使用模块化的 XHTML，产品和软件设计者可以：

选择被某种设备所支持的元素。

在不打破 XHTML 标准的情况下，使用 XML 对 XHTML 进行扩展。

针对小型设备，对 XHTML 进行简化。

通过添加新的 XML 功能（比如 MathML, SVG, 语音和多媒体），针对复杂的应用对 XHTML 进行扩展。

定义 XHTML 框架，比如 XHTML BASIC （针对移动设备的 XHTML 子集）。

XHTML 模块

W3C 已将 XHTML 的定义分为28种模型：

模块名称	描述
Applet Module (Applet模块)	定义已被废弃的applet元素。
Base Module (基础模块)	定义基本元素。
Basic Forms Module (基础表单模块)	定义基本的表单元素 (forms)。
Basic Tables Module (基础表格模块)	定义基本的表格元素 (table)。
Bi-directional Text Module (双向文本模块)	定义bdo元素。
Client Image Map Module(客户端图像映射模块)	定义浏览器端图像映射元素(image map elements)。
Edit Module (编辑模块)	定义编辑元素删除和插入。
Forms Module (表单模块)	定义所有在表单中使用的元素。
Frames Module (框架模块)	定义frameset元素。
Hypertext Module (超文本模块)	定义a元素。
Iframe Module (内联框架模块)	定义iframe元素。
Image Module (图像模块)	定义图像元素 (img)。
Intrinsic Events Module ()	定义事件属性 (event)，比如onblur和onchange。
Legacy Module (遗留模块)	定义被废弃的元素和属性。
Link Module (链接模块)	定义链接 (link)元素。
List Module (列表模块)	定义列表元素ol, li, ul, dd, dt,和dl。
Metainformation Module (元信息模块)	定义meta元素。
Name Identification Module (名称识别模块)	定义已被废弃的name属性。
Object Module (对象模块)	定义对象元素 (object)和param元素。
Presentation Module (表现模块)	定义表现元素比如b和i。
Scripting Module (脚本模块)	定义脚本 (script)和无脚本 (noscript)元素。
Server Image Map Module(服务器端图像映射模块)	定义服务器端图像映射(server side image map)元素
Structure Module (结构模块)	定义以下元素：html, head, title and body。
Style Attribute Module (样式属性模块)	定义样式属性。
Style Sheet Module (样式表模块)	定义样式元素。
Tables Module (表格模块)	定义用于表格中的元素。
Target Module (Target模块)	定义target属性。
Text Module (文本模块)	定义文本容器元素 (text container)，比如p和h1。

*注：已被废弃的元素不应被用于XHTML之中。

HTML 标签拥有属性。每个标签的特殊属性均被列于每个标签描述之下。这里列出的属性是通用于每个标签的核心属性和语言属性（有个别例外）。

核心属性 (Core Attributes)

以下标签不提供下面的属性：base, head, html, meta, param, script, style, 以及 title 元素。

属性	值	描述
class	class_rule 或 style_rule	元素的类(class)
id	id_name	元素的某个特定id
style	样式定义	内联样式定义
title	提示文本	显示于提示工具中的文本

语言属性 (Language Attributes)

以下标签不提供下面的属性：base, br, frame, frameset, hr, iframe, param, 以及 script 元素。

属性	值	描述
dir	ltr \| rtl	设置文本的方向
lang	语言代码	设置语言代码

键盘属性 (Keyboard Attributes)

属性	值	描述
accesskey	字符	设置访问某元素的键盘快捷键
tabindex	数	设置某元素的Tab次序

XHTML 事件属性

HTML 4.0 的新特性之一是使 HTML 事件触发浏览器中的行为，比方说当用户点击一个 HTML 元素时启动一段 JavaScript 。以下就是可被插入 HTML 标签以定义事件行为的一系列属性。

假如你希望学习如何使用这些事件进行编程，那么你应该学习我们的和。

窗口事件 (Window Events)

仅在 body 和 frameset 元素中有效。

属性	值	描述
onload	脚本	当文档被载入时执行脚本
onunload	脚本	当文档被卸下时执行脚本

表单元素事件 (Form Element Events)

仅在表单元素中有效。

属性	值	描述
onchange	脚本	当元素改变时执行脚本
onsubmit	脚本	当表单被提交时执行脚本
onreset	脚本	当表单被重置时执行脚本
onselect	脚本	当元素被选取时执行脚本
onblur	脚本	当元素失去焦点时执行脚本
onfocus	脚本	当元素获得焦点时执行脚本

键盘事件 (Keyboard Events)

在下列元素中无效：base, bdo, br, frame, frameset, head, html, iframe, meta, param, script, style, 以及 title 元素。

属性	值	描述
onkeydown	脚本	当键盘被按下时执行脚本
onkeypress	脚本	当键盘被按下后又松开时执行脚本
onkeyup	脚本	当键盘被松开时执行脚本

鼠标事件 (Mouse Events)

在下列元素中无效：base, bdo, br, frame, frameset, head, html, iframe, meta, param, script, style, title 元素。

属性	值	描述
onclick	脚本	当鼠标被单击时执行脚本
ondblclick	脚本	当鼠标被双击时执行脚本
onmousedown	脚本	当鼠标按钮被按下时执行脚本
onmousemove	脚本	当鼠标指针移动时执行脚本
onmouseout	脚本	当鼠标指针移出某元素时执行脚本
onmouseover	脚本	当鼠标指针悬停于某元素之上时执行脚本
onmouseup	脚本	当鼠标按钮被松开时执行脚本

下面将介绍一些关于XHTML语义标签

HTML 参考手册

按字母顺序排列

New : HTML5 中的新标签。

标签	描述
	定义注释。
	定义文档类型。
	定义锚。
	定义缩写。
	定义只取首字母的缩写。
	定义文档作者或拥有者的联系信息。
	不赞成使用。定义嵌入的 applet。
	定义图像映射内部的区域。
	定义文章。
	定义页面内容之外的内容。
	定义声音内容。
	定义粗体字。
	定义页面中所有链接的默认地址或默认目标。
	不赞成使用。定义页面中文本的默认字体、颜色或尺寸。
	定义文本的文本方向，使其脱离其周围文本的方向设置。
	定义文字方向。
	定义大号文本。
	定义长的引用。
	定义文档的主体。
	定义简单的折行。
	定义按钮 (push button)。
	定义图形。
	定义表格标题。
	不赞成使用。定义居中文本。
	定义引用(citation)。
	定义计算机代码文本。
	定义表格中一个或多个列的属性值。
	定义表格中供格式化的列组。
	定义命令按钮。
	定义下拉列表。
	定义定义列表中项目的描述。
	定义被删除文本。
	定义元素的细节。
	不赞成使用。定义目录列表。
	定义文档中的节。
	定义定义项目。
	定义对话框或窗口。
	定义定义列表。
	定义定义列表中的项目。
	定义强调文本。
	定义外部交互内容或插件。
	定义围绕表单中元素的边框。
	定义 figure 元素的标题。
	定义媒介内容的分组，以及它们的标题。
	不赞成使用。定义文字的字体、尺寸和颜色。
	定义 section 或 page 的页脚。
	定义供用户输入的 HTML 表单。
	定义框架集的窗口或框架。
	定义框架集。
	定义 HTML 标题。
	定义关于文档的信息。
	定义 section 或 page 的页眉。
	定义水平线。
	定义 HTML 文档。
	定义斜体字。
	定义内联框架。
	定义图像。
	定义输入控件。
	定义被插入文本。
<isindex>	不赞成使用。定义与文档相关的可搜索索引。
	定义键盘文本。
	定义生成密钥。
	定义 input 元素的标注。
	定义 fieldset 元素的标题。
	定义列表的项目。
	定义文档与外部资源的关系。
	定义图像映射。
	定义有记号的文本。
	定义命令的列表或菜单。
	定义用户可以从弹出菜单调用的命令/菜单项目。
	定义关于 HTML 文档的元信息。
	定义预定义范围内的度量。
	定义导航链接。
	定义针对不支持框架的用户的替代内容。
	定义针对不支持客户端脚本的用户的替代内容。
	定义内嵌对象。
	定义有序列表。
	定义选择列表中相关选项的组合。
	定义选择列表中的选项。
	定义输出的一些类型。
	定义段落。
	定义对象的参数。
	定义预格式文本。
	定义任何类型的任务的进度。
	定义短的引用。
	定义若浏览器不支持 ruby 元素显示的内容。
	定义 ruby 注释的解释。
	定义 ruby 注释。
	不赞成使用。定义加删除线的文本。
	定义计算机代码样本。
	定义客户端脚本。
	定义 section。
	定义选择列表（下拉列表）。
	定义小号文本。
	定义媒介源。
	定义文档中的节。
	不赞成使用。定义加删除线文本。
	定义强调文本。
	定义文档的样式信息。
	定义下标文本。
	为 <details> 元素定义可见的标题。
	定义上标文本。
	定义表格。
	定义表格中的主体内容。
	定义表格中的单元。
	定义多行的文本输入控件。
	定义表格中的表注内容（脚注）。
	定义表格中的表头单元格。
	定义表格中的表头内容。
	定义日期/时间。
	定义文档的标题。
	定义表格中的行。
	定义用在媒体播放器中的文本轨道。
	定义打字机文本。
	不赞成使用。定义下划线文本。
	定义无序列表。
	定义文本的变量部分。
	定义视频。
	定义可能的换行符。
<xmp>	不赞成使用。定义预格式文本。