Xhtml 简明教程

XHTML - Quick Guide

XHTML - Introduction

XHTML是E*X*tensible *H*yper*T*ext *M*arkup *L*anguage的首字母缩写。这是互联网发展中的下一步。XHTML 1.0是XHTML系列中的第一个文档类型。

XHTML stands for E*X*tensible *H*yper*T*ext *M*arkup *L*anguage. It is the next step in the evolution of the internet. The XHTML 1.0 is the first document type in the XHTML family.

XHTML几乎与HTML 4.01相同,只有很少的差异。这是HTML 4.01的一个更简洁、更严格的版本。如果你已经知道HTML,那么你只需要稍加注意就可以学习这个最新的HTML版本。

XHTML is almost identical to HTML 4.01 with only few differences. This is a cleaner and stricter version of HTML 4.01. If you already know HTML, then you need to give little attention to learn this latest version of HTML.

XHTML是由万维网联盟(W3C)开发的,为了帮助网络开发者实现从HTML到XML的过渡。通过现在迁移到XHTML,网络开发者可以利用它的所有好处进入XML世界,同时仍然相信内容的向后和未来兼容性。

XHTML was developed by World Wide Web Consortium (W3C) to help web developers make the transition from HTML to XML. By migrating to XHTML today, web developers can enter the XML world with all of its benefits, while still remaining confident in the backward and future compatibility of the content.

Why Use XHTML?

将他们的内容迁移到XHTML 1.0的开发者们获得了以下好处:

Developers who migrate their content to XHTML 1.0 get the following benefits −

  1. XHTML documents are XML conforming as they are readily viewed, edited, and validated with standard XML tools.

  2. XHTML documents can be written to operate better than they did before in existing browsers as well as in new browsers.

  3. XHTML documents can utilize applications such as scripts and applets that rely upon either the HTML Document Object Model or the XML Document Object Model.

  4. XHTML gives you a more consistent, well-structured format so that your webpages can be easily parsed and processed by present and future web browsers.

  5. You can easily maintain, edit, convert and format your document in the long run.

  6. Since XHTML is an official standard of the W3C, your website becomes more compatible with many browsers and it is rendered more accurately.

  7. XHTML combines strength of HTML and XML. Also, XHTML pages can be rendered by all XML enabled browsers.

  8. XHTML defines quality standard for your webpages and if you follow that, then your web pages are counted as quality web pages. The W3C certifies those pages with their quality stamp.

网络开发者和网络浏览器设计师不断地发现新的方法通过新的标记语言表达他们的想法。在XML中,引入新元素或额外的元素属性相对容易。XHTML系列被设计为通过XHTML模块和开发新的符合XHTML的模块的技术来适应这些扩展。这些模块允许在开发内容和设计新的用户代理时组合现有和新的功能。

Web developers and web browser designers are constantly discovering new ways to express their ideas through new markup languages. In XML, it is relatively easy to introduce new elements or additional element attributes. The XHTML family is designed to accommodate these extensions through XHTML modules and techniques for developing new XHTML-conforming modules. These modules permit the combination of existing and new features at the time of developing content and designing new user agents.

Basic Understanding

在我们继续之前,让我们快速浏览一下什么是HTML、XML和SGML。

Before we proceed further, let us have a quick view on what are HTML, XML, and SGML.

What is SGML?

这是一个符合国际标准ISO 8879的*S*tandard *G*eneralized *M*arkup *L*anguage (SGML)应用程序。HTML被广泛认为是万维网的标准出版语言。

This is *S*tandard *G*eneralized *M*arkup *L*anguage (SGML) application conforming to International Standard ISO 8879. HTML is widely regarded as the standard publishing language of the World Wide Web.

这是一种用于描述标记语言的语言,特别是那些用于电子文档交换、文档管理和文档发布的语言。HTML是SGML中定义的语言的一个例子。

This is a language for describing markup languages, particularly those used in electronic document exchange, document management, and document publishing. HTML is an example of a language defined in SGML.

What is XML?

XML代表E*X*tensible *M*arkup *L*anguage。XML是一种标记语言,很像HTML,并且它被设计用来描述数据。XML标签不是预先定义的。你必须根据自己的需要定义自己的标签。

XML stands for E*X*tensible *M*arkup *L*anguage. XML is a markup language much like HTML and it was designed to describe data. XML tags are not predefined. You must define your own tags according to your needs.

XHTML - Syntax

XHTML 语法与 HTML 语法非常相似,几乎所有有效的 HTML 元素在 XHTML 中也都是有效的。但是当你编写 XHTML 文档时,你需要多加留意一点,以使你的 HTML 文档符合 XHTML。

XHTML syntax is very similar to HTML syntax and almost all the valid HTML elements are valid in XHTML as well. But when you write an XHTML document, you need to pay a bit extra attention to make your HTML document compliant to XHTML.

以下是在编写新 XHTML 文档或将现有 HTML 文档转换为 XHTML 文档时要记住的重要事项 −

Here are the important points to remember while writing a new XHTML document or converting existing HTML document into XHTML document −

  1. Write a DOCTYPE declaration at the start of the XHTML document.

  2. Write all XHTML tags and attributes in lower case only.

  3. Close all XHTML tags properly.

  4. Nest all the tags properly.

  5. Quote all the attribute values.

  6. Forbid Attribute minimization.

  7. Replace the name attribute with the id attribute.

  8. Deprecate the language attribute of the script tag.

以下是上述 XHTML 规则的详细说明 −

Here is the detail explanation of the above XHTML rules −

DOCTYPE Declaration

所有 XHTML 文档都必须在开头有一个 DOCTYPE 声明。有三种类型的 DOCTYPE 声明,将在 XHTML 文档类型一章中详细讨论。以下是如何使用 DOCTYPE 的示例 −

All XHTML documents must have a DOCTYPE declaration at the start. There are three types of DOCTYPE declarations, which are discussed in detail in XHTML Doctypes chapter. Here is an example of using DOCTYPE −

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

Case Sensitivity

XHTML 是一种区分大小写的标记语言。所有 XHTML 标签和属性都必须仅以小写书写。

XHTML is case sensitive markup language. All the XHTML tags and attributes need to be written in lower case only.

<!-- This is invalid in XHTML -->
<A Href="/xhtml/xhtml_tutorial.html">XHTML Tutorial</A>

<!-- Correct XHTML way of writing this is as follows -->
<a href="/xhtml/xhtml_tutorial.html">XHTML Tutorial</a>

示例中, Href 和锚标签 A 不是小写,因此不正确。

In the example, Href and anchor tag A are not in lower case, so it is incorrect.

Closing the Tags

每个 XHTML 标签都应有一个等效的结束标签,即使为空元素也应有结束标签。以下示例显示了使用标签的有效和无效方式 −

Each and every XHTML tag should have an equivalent closing tag, even empty elements should also have closing tags. Here is an example showing valid and invalid ways of using tags −

<!-- This is invalid in XHTML -->
<p>This paragraph is not written according to XHTML syntax.

<!-- This is also invalid in XHTML -->
<img src="/images/xhtml.gif" >

以下语法显示了用 XHTML 正确编写上面标签的方法。不同之处在于,我们在这里正确地关闭了这两个标签。

The following syntax shows the correct way of writing above tags in XHTML. Difference is that, here we have closed both the tags properly.

<!-- This is valid in XHTML -->
<p>This paragraph is not written according to XHTML syntax.</p>

<!-- This is also valid now -->
<img src="/images/xhtml.gif" />

Attribute Quotes

所有 XHTML 属性值都必须加引号。否则,你的 XHTML 文档将被视为无效文档。以下示例显示了语法 −

All the values of XHTML attributes must be quoted. Otherwise, your XHTML document is assumed as an invalid document. Here is the example showing syntax −

<!-- This is invalid in XHTML -->
<img src="/images/xhtml.gif" width=250 height=50 />

<!-- Correct XHTML way of writing this is as follows -->
<img src="/images/xhtml.gif" width="250" height="50" />

Attribute Minimization

XHTML 不允许属性最小化。这意味着你需要明确指定属性及其值。以下示例显示了区别 −

XHTML does not allow attribute minimization. It means you need to explicitly state the attribute and its value. The following example shows the difference −

<!-- This is invalid in XHTML -->
<option selected>

<!-- Correct XHTML way of writing this is as follows -->
<option selected="selected">

以下是 HTML 中的最小化属性以及你必须在 XHTML 中编写它们的列表 −

Here is a list of the minimized attributes in HTML and the way you need to write them in XHTML −

HTML Style

XHTML Style

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"

The id Attribute

id 属性替换了 name 属性。XHTML 倾向于使用 id = "id",而不是使用 name = "name"。以下示例显示了如何 −

The id attribute replaces the name attribute. Instead of using name = "name", XHTML prefers to use id = "id". The following example shows how −

<!-- This is invalid in XHTML -->
<img src="/images/xhtml.gif" name="xhtml_logo" />

<!-- Correct XHTML way of writing this is as follows -->
<img src="/images/xhtml.gif" id="xhtml_logo" />

The language Attribute

script 标签的 language 属性已弃用。以下示例显示了此差异 −

The language attribute of the script tag is deprecated. The following example shows this difference −

<!-- This is invalid in XHTML -->

<script language="JavaScript" type="text/JavaScript">
   document.write("Hello XHTML!");
</script>

<!-- Correct XHTML way of writing this is as follows -->

<script type="text/JavaScript">
   document.write("Hello XHTML!");
</script>

Nested Tags

您必须正确嵌套所有 XHTML 标签。否则,您的文档将被假设为不正确的 XHTML 文档。以下示例显示了语法 −

You must nest all the XHTML tags properly. Otherwise your document is assumed as an incorrect XHTML document. The following example shows the syntax −

<!-- This is invalid in XHTML -->
<b><i> This text is bold and italic</b></i>

<!-- Correct XHTML way of writing this is as follows -->
<b><i> This text is bold and italic</i></b>

Element Prohibitions

以下元素不允许在其内部有任何其他元素。此禁止适用于所有嵌套深度。这意味着,它包括所有后代元素。

The following elements are not allowed to have any other element inside them. This prohibition applies to all depths of nesting. Means, it includes all the descending elements.

Element

Prohibition

<a>

Must not contain other <a> elements.

<pre>

Must not contain the <img>, <object>, <big>, <small>, <sub>, or <sup> elements.

<button>

Must not contain the <input>, <select>, <textarea>, <label>, <button>, <form>, <fieldset>, <iframe> or <isindex> elements.

<label>

Must not contain other <label> elements.

<form>

Must not contain other <form> elements.

A Minimal XHTML Document

以下示例向您展示了 XHTML 1.0 文档的最小内容 −

The following example shows you a minimum content of an XHTML 1.0 document −

<?xml version="1.0" encoding="UTF-8"?>

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

<html xmlns="http://www.w3.org/TR/xhtml1" xml:lang="en" lang="en">
   <head>
      <title>Every document must have a title</title>
   </head>

   <body>
      ...your content goes here...
   </body>
</html>

HTML Versus XHTML

由于 XHTML 是 XML 应用程序,因此某些在基于 SGML 的 HTML 4 中完全合法的做法必须更改。您已经在前面的章节中看到了 XHTML 语法,因此 XHTML 和 HTML 之间的差异非常明显。以下是 XHTML 和 HTML 的比较。

Due to the fact that XHTML is an XML application, certain practices that were perfectly legal in SGML-based HTML 4 must be changed. You already have seen XHTML syntax in previous chapter, so differences between XHTML and HTML are very obvious. Following is the comparison between XHTML and HTML.

XHTML Documents Must be Well-Formed

合法性是 XML 引入的一个新概念。从本质上讲,这意味着所有元素都必须有关闭标签,并且您必须正确嵌套它们。

Well-formedness is a new concept introduced by XML. Essentially, this means all the elements must have closing tags and you must nest them properly.

CORRECT: Nested Elements

CORRECT: Nested Elements

<p>Here is an emphasized <em>paragraph</em>.</p>

INCORRECT: Overlapping Elements

INCORRECT: Overlapping Elements

<p>Here is an emphasized <em>paragraph.</p></em>

Elements and Attributes Must be in Lower Case

XHTML 文档必须对所有 HTML 元素和属性名称使用小写。此差异是有必要的,因为 XHTML 文档被假定为 XML 文档,而 XML 区分大小写。例如,<li> 和 <LI> 是不同的标签。

XHTML documents must use lower case for all HTML elements and attribute names. This difference is necessary because XHTML document is assumed to be an XML document and XML is case-sensitive. For example, <li> and <LI> are different tags.

End Tags are Required for all Elements

在 HTML 中,某些元素允许省略结束标签。但 XML 不允许省略结束标签。

In HTML, certain elements are permitted to omit the end tag. But XML does not allow end tags to be omitted.

CORRECT: Terminated Elements

CORRECT: Terminated Elements

<p>Here is a paragraph.</p><p>here is another paragraph.</p>
<br><hr/>

INCORRECT: Unterminated Elements

INCORRECT: Unterminated Elements

<p>Here is a paragraph.<p>here is another paragraph.
<br><hr>

Attribute Values Must Always be Quoted

所有属性值,包括数字值,都必须加引号。

All attribute values including numeric values, must be quoted.

CORRECT: Quoted Attribute Values

CORRECT: Quoted Attribute Values

<td rowspan="3">

INCORRECT: Unquoted Attribute Values

INCORRECT: Unquoted Attribute Values

<td rowspan=3>

Attribute Minimization

XML 不支持最小化属性。属性值对必须写完整。不能在没有指定其值的元素中出现 compact 和 checked 等属性名称。

XML does not support attribute minimization. Attribute-value pairs must be written in full. Attribute names such as compact and checked cannot occur in elements without their value being specified.

CORRECT: Non Minimized Attributes

CORRECT: Non Minimized Attributes

<dl compact="compact">

INCORRECT: Minimized Attributes

INCORRECT: Minimized Attributes

<dl compact>

Whitespace Handling in Attribute Values

浏览器在处理属性时会执行以下操作:

When a browser processes attributes, it does the following −

  1. Strips leading and trailing whitespace.

  2. Maps sequences of one or more white space characters (including line breaks) to a single inter-word space.

Script and Style Elements

在 XHTML 中,如果存在 script 和 style 元素,它们不应该直接包含“<”和“&”字符;如果存在,它们会被视为标记的开始。“<”和“&”等实体会被 XML 处理器识别为实体引用,以分别显示“<”和“&”字符。

In XHTML, the script and style elements should not have “<” and “&” characters directly, if they exist; then they are treated as the start of markup. The entities such as “<” and “&” are recognized as entity references by the XML processor for displaying “<” and “&” characters respectively.

用 CDATA 标记部分包装 script 或 style 元素的内容可以避免这些实体的展开。

Wrapping the content of the script or style element within a CDATA marked section avoids the expansion of these entities.

<script type="text/JavaScript">
   <![CDATA[
      ... unescaped VB or Java Script here... ...
   ]]>
</script>

一种替代方法是使用外部 script 和 style 文档。

An alternative is to use external script and style documents.

The Elements with id and name Attributes

XHTML 建议将 name 属性替换为 id 属性。请注意,在 XHTML 1.0 中,这些元素的 name 属性已正式弃用,并且将在后续版本的 XHTML 中将其移除。

XHTML recommends the replacement of name attribute with id attribute. Note that in XHTML 1.0, the name attribute of these elements is formally deprecated, and it will be removed in a subsequent versions of XHTML.

Attributes with Pre-defined Value Sets

HTML 和 XHTML 都有具有预定义且有限的值集的一些属性。例如, type 元素的 input 属性。在 HTML 和 XML 中,这些被称为 enumerated attributes 。在 HTML 4 下,这些值的解释不区分大小写,因此, TEXT 的值等同于 text 的值。

HTML and XHTML both have some attributes that have pre-defined and limited sets of values. For example, type attribute of the input element. In HTML and XML, these are called enumerated attributes. Under HTML 4, the interpretation of these values was case-insensitive, so a value of TEXT was equivalent to a value of text.

在 XHTML 下,这些值的解释区分大小写,因此,所有这些值都定义为小写。

Under XHTML, the interpretation of these values is case-sensitive so all of these values are defined in lower-case.

Entity References as Hex Values

HTML 和 XML 都允许使用十六进制值引用字符。在 HTML 中,这些引用可以使用 &#Xnn;&#xnn; ,并且是有效的,但是在 XHTML 文档中,您必须仅使用小写版本,例如 &#xnn;

HTML and XML both permit references to characters by using hexadecimal value. In HTML these references could be made using either &#Xnn; or &#xnn; and they are valid but in XHTML documents, you must use the lower-case version only such as &#xnn;.

The <html> Element is a Must

所有 XHTML 元素都必须嵌套在<html>根元素内。所有其他元素都可以具有必须成对出现并正确嵌套在其父元素中的子元素。基本文档结构如下:

All XHTML elements must be nested within the <html> root element. All other elements can have sub elements which must be in pairs and correctly nested within their parent element. The basic document structure is −

<!DOCTYPE html....>

<html>
   <head> ... </head>
   <body> ... </body>
</html>

XHTML - Doctypes

XHTML 标准定义了三个文档类型定义 (DTD)。最常用且最简单的是 XHTML 过渡文档。

The XHTML standard defines three Document Type Definitions (DTDs). The most commonly used and easy one is the XHTML Transitional document.

XHTML 1.0 文档类型定义对应于三个 DTD:

XHTML 1.0 document type definitions correspond to three DTDs −

  1. Strict

  2. Transitional

  3. Frameset

有一些 XHTML 元素和属性,在某个 DTD 中可用而在另一个 DTD 中不可用。因此,在编写 XHTML 文档时,您必须仔细选择您的 XHTML 元素或属性。但是,XHTML 验证器可以帮助您识别有效和无效的元素和属性。

There are few XHTML elements and attributes, which are available in one DTD but not available in another DTD. Therefore, while writing your XHTML document, you must select your XHTML elements or attributes carefully. However, XHTML validator helps you to identify valid and invalid elements and attributes.

请参阅 XHTML Validations 了解更多详细信息。

Please check XHTML Validations for more detail on this.

XHTML 1.0 Strict

如果您计划严格使用层叠样式表 (CSS) 并避免编写大部分 XHTML 特性,那么建议使用此 DTD。符合此 DTD 的文档质量较好。

If you are planning to use Cascading Style Sheet (CSS) strictly and avoiding to write most of the XHTML attributes, then it is recommended to use this DTD. A document conforming to this DTD is of the best quality.

如果您想使用 XHTML 1.0 Strict DTD,那么您需要在 XHTML 文档顶部包含以下行。

If you want to use XHTML 1.0 Strict DTD then you need to include the following line at the top of your XHTML document.

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

XHTML 1.0 Transitional

如果您计划使用许多 XHTML 特性和一些层叠样式表属性,那么您应该使用此 DTD 并相应编写您的 XHTML 文档。

If you are planning to use many XHTML attributes as well as few Cascading Style Sheet properties, then you should adopt this DTD and you should write your XHTML document accordingly.

如果您想使用 XHTML 1.0 Transitional DTD,那么您需要在 XHTML 文档顶部包含以下行。

If you want to use XHTML 1.0 Transitional DTD, then you need to include the following line at the top of your XHTML document.

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

XHTML 1.0 Frameset

当您想要使用 HTML 框架将浏览器窗口分割成两个或更多个框架时,您可以使用它。

You can use this when you want to use HTML Frames to partition the browser window into two or more frames.

如果您想使用 XHTML 1.0 Frameset DTD,那么您需要在 XHTML 文档顶部包含以下行。

If you want to use XHTML 1.0 Frameset DTD, then you need to include following line at the top of your XHTML document.

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

Note − 无论您使用什么 DTD 来编写您的 XHTML 文档;如果它是一个有效的 XHTML 文档,那么您的文档被视为一个好的文档。

Note − No matter what DTD you are using to write your XHTML document; if it is a valid XHTML document, then your document is considered as a good quality document.

XHTML - Attributes

有少数几个 XHTML/HTML 特性是所有 XHTML/HTML 标签的标准且关联的。这些特性在此列出并附有简短说明−

There are a few XHTML/HTML attributes which are standard and associated to all the XHTML/HTML tags. These attributes are listed here with brief description −

Core Attributes

在 base、head、html、meta、param、script、style 和 title 元素中无效。

Not valid in base, head, html, meta, param, script, style, and title elements.

Attribute

Value

Description

class

class_rule or style_rule

The class of the element.

Id

id_name

A unique id for the element.

style

style_definition

An inline style definition.

Title

tooltip_text

A text to display in a mouse tip.

Language Attributes

lang 特性表明正在为封闭内容使用哪种语言。语言使用 ISO 标准语言缩写来识别,例如, fr 表示法语, en 表示英语,等等。更多代码和它们的格式在 www.ietf.org 中有描述。

The lang attribute indicates the language being used for the enclosed content. The language is identified using the ISO standard language abbreviations, such as fr for French, en for English, and so on. More codes and their formats are described at www.ietf.org.

在 base、br、frame、frameset、hr、iframe、param 和 script 元素中无效。

Not valid in base, br, frame, frameset, hr, iframe, param, and script elements.

Attribute

Value

Description

dir

ltr

rtl

Sets the text direction.

lang

language_code

Microsoft Proprietary Attributes

微软通过 Internet Explorer 4 及更高版本引入了许多新的私有特性。

Microsoft introduced a number of new proprietary attributes with the Internet Explorer 4 and higher versions.

Attribute

Value

Description

accesskey

character

Sets a keyboard shortcut to access an element.

language

string

This attribute specifies the scripting language to be used with an associated script bound to the element, typically through an event handler attribute. Possible values might include JavaScript, jScript, VBS, and VBScript.

tabindex

number

Sets the tab order of an element.

contenteditable

boolean

Allows users to edit content rendered in Internet Explorer 5.5 or greater. Possible values are true or false.

disabled

boolean

Elements with the disabled attribute set may appear faded and will not respond to user input. Possible values are true or false.

hidefocus

on or off

This proprietary attribute, introduced with Internet Explorer 5.5, hides focus on an element’s content. Focus must be applied to the element using the tabindex attribute.

unselectable

on or off

Used to prevent content displayed in Internet Explorer 5.5 from being selected.

XHTML - Events

当用户访问某个网站时,他们会做一些事情,比如点击文本、图像和超链接,浮动在某个东西上面等等。这些是 JavaScript 中事件的示例。

When users visit a website, they do things such as click on text, images and hyperlinks, hover-over things, etc. These are examples of what JavaScript calls events.

我们可以在 JavaScript 或 VBScript 中编写我们的事件处理程序,并且可以将这些事件处理程序指定为事件标记属性的值。XHTML 1.0 有一组类似的事件,这些事件在 HTML 4.01 规范中有提供。

We can write our event handlers in JavaScript or VBScript and can specify these event handlers as a value of event tag attribute. The XHTML 1.0 has a similar set of events which is available in HTML 4.01 specification.

The <body> and <frameset> Level Events

只有两个属性可用在文件级别任何事件发生时触发任何 JavaScript 或 VBScript 代码。

There are only two attributes which can be used to trigger any JavaScript or VBScript code, when any event occurs at document level.

Attribute

Value

Description

onload

Script

Script runs when a XHTML document loads.

onunload

Script

Script runs when a XHTML document unloads.

Note − 在这里,脚本是指 VBScript 或 JavaScript 的任何函数或代码片段。

Note − Here, the script refers to any function or piece of code of VBScript or JavaScript.

The <form> Level Events

有以下六个属性可用在表单级别任何事件发生时触发任何 JavaScript 或 VBScript 代码。

There are following six attributes which can be used to trigger any JavaScript or VBScript code when any event occurs at form level.

Attribute

Value

Description

onchange

Script

Script executes when the element changes.

onsubmit

Script

Script executes when the form is submitted.

onreset

Script

Script executes when the form is reset.

onselect

Script

Script executes when the element is selected.

onblur

Script

Script executes when the element loses focus.

onfocus

Script

Script runs when the element gets focus.

Keyboard Events

以下三个事件是由键盘生成的。这些事件在 base、bdo、br、frame、frameset、head、html、iframe、meta、param、script、style 和 title 元素中是无效的。

The following three events are generated by keyboard. These events are not valid in base, bdo, br, frame, frameset, head, html, iframe, meta, param, script, style, and title elements.

Attribute

Value

Description

onkeydown

Script

Script executes on key press.

onkeypress

Script

Script executes on key press and release.

onkeyup

Script

Script executes key release.

Other Events

当鼠标与任意 HTML 标签接触时,将生成以下七个事件。这些事件在 base、bdo、br、frame、frameset、head、html、iframe、meta、param、script、style 和 title 元素中无效。

The following seven events are generated by mouse when it comes in contact with any HTML tag. These events are not valid in base, bdo, br, frame, frameset, head, html, iframe, meta, param, script, style, and title elements.

Attribute

Value

Description

onclick

Script

Script executes on a mouse click.

ondblclick

Script

Script executes on a mouse double-click.

onmousedown

Script

Script executes when mouse button is pressed.

onmousemove

Script

Script executes when mouse pointer moves.

onmouseout

Script

Script executes when mouse pointer moves out of an element.

onmouseover

Script

Script executes when mouse pointer moves over an element.

onmouseup

Script

Script executes when mouse button is released.

XHTML - Version 1.1

W3C 帮助互联网内容开发社区从错误、非标准标记的时代移到了结构良好、有效的 XML 世界。在 XHTML 1.0 中,这一举动因旨在提供将现有的 HTML 4(或更早版本)内容轻松迁移至 XHTML 和 XML 而得以缓解。

The W3C has helped move the internet content-development community from the days of malformed, non-standard mark-up into the well-formed, valid world of XML. In XHTML 1.0, this move was moderated by the goal of providing easy migration of existing HTML 4 (or earlier) based content to XHTML and XML.

W3C 从 XHTML 家族中删除了对不推荐使用的元素和属性的支持。这些元素和属性在很大程度上具有以演示为导向的功能,而这更适合通过样式表或特定于客户端的默认行为来处理。

The W3C has removed support for deprecated elements and attributes from the XHTML family. These elements and attributes had largely presentation-oriented functionality that is better handled via style sheets or client-specific default behavior.

现在,W3C 的 HTML 工作组已定义了一种初始文档类型,仅基于 XHTML 1.1 模块。此文档类型旨在可移植至广泛的客户端设备,并且适用于大多数互联网内容。

Now the W3C’s HTML Working Group has defined an initial document type based solely upon modules which are XHTML 1.1. This document type is designed to be portable to a broad collection of client devices, and applicable to the majority of internet content.

Document Conformance

XHTML 1.1 为必须满足以下所有条件的严格符合标准的 XHTML 文档提供了定义 -

The XHTML 1.1 provides a definition of strictly conforming XHTML documents which MUST meet all the following criteria −

  1. The document MUST conform to the constraints expressed in XHTML 1.1 Document Type Definition.

  2. The root element of the document MUST be <html>.

  3. The root element of the document MUST designate the XHTML namespace using the xmlns attribute.

  4. The root element MAY also contain a schema location attribute as defined in the XML Schema.

根元素之前必须在文档中有一个 DOCTYPE 声明。如果存在,则 DOCTYPE 声明中包含的公共标识符必须引用 XHTML 1.1 文档类型定义中找到的 DTD。

There MUST be a DOCTYPE declaration in the document prior to the root element. If it is present, the public identifier included in the DOCTYPE declaration MUST refer the DTD found in XHTML 1.1 Document Type Definition.

以下是对 XHTML 1.1 文档的示例 -

Here is an example of an XHTML 1.1 document −

<?xml version="1.0" encoding="UTF-8"?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
   xsi:schemaLocation="http://www.w3.org/MarkUp/SCHEMA/xhtml11.xsd" xml:lang="en">

   <head>
      <title>This is the document title</title>
   </head>

   <body>
      <p>Moved to <a href="http://example.org/">example.org</a>.</p>
   </body>

</html>

Note − 此示例中包含 XML 声明。并非所有 XML 文档都需要使用上述 XML 声明。强烈建议 XHTML 文档作者在所有文档中使用 XML 声明。当文档的字符编码不是默认的 UTF-8 或 UTF-16 时,则需要声明。

Note − In this example, the XML declaration is included. An XML declaration such as the one above is not required in all XML documents. XHTML document authors are strongly encouraged to use XML declarations in all their documents. Such a declaration is required when the character encoding of the document is other than the default UTF-8 or UTF-16.

XHTML 1.1 Modules

XHTML 1.1 文档类型包含以下 XHTML 模块。

The XHTML 1.1 document type is made up of the following XHTML modules.

Structure Module - 结构模块为 XHTML 定义主要结构元素。这些元素有效地作为许多 XHTML 系列文档类型的内容模型的基础。此模块中包含的元素和属性有 body、head、html 和 title。

Structure Module − The Structure Module defines the major structural elements for XHTML. These elements effectively act as the basis for the content model of many XHTML family document types. The elements and attributes included in this module are − body, head, html, and title.

Text Module - 此模块定义所有基本文本容器元素、属性及其内容模型 - abbr、acronym、address、blockquote、br、cite、code、dfn、div、em、h1、h2、h3、h4、h5、h6、kbd、p、pre、q、 samp、span、strong 和 var。

Text Module − This module defines all of the basic text container elements, attributes, and their content model − abbr, acronym, address, blockquote, br, cite, code, dfn, div, em, h1, h2, h3, h4, h5, h6, kbd, p, pre, q, samp, span, strong, and var.

Hypertext Module - 超文本模块提供用于定义到其他资源的超文本链接的元素。此模块支持元素 a。

Hypertext Module − The Hypertext Module provides the element that is used to define hypertext links to other resources. This module supports element a.

List Module - 正如其名称所暗示的,列表模块提供以列表为导向的元素。具体来说,List Module 支持以下元素和属性:dl、dt、dd、ol、ul 和 li。

List Module − As its name suggests, the List Module provides list-oriented elements. Specifically, the List Module supports the following elements and attributes − dl, dt, dd, ol, ul, and li.

Object Module - Object Module 提供用于通用的对象包含的元素。具体来说,Object Module 支持 - object 和 param。

Object Module − The Object Module provides elements for general-purpose object inclusion. Specifically, the Object Module supports − object and param.

Presentation Module - 此模块定义元素、属性和与简单的表示相关标记的极小内容模型——b、big、hr、i、small、sub、sup 和 tt。

Presentation Module − This module defines elements, attributes, and a minimal content model for simple presentation-related markup − b, big, hr, i, small, sub, sup, and tt.

Edit Module - 此模块定义元素和属性,用于与编辑相关的标记——del 和 ins。

Edit Module − This module defines elements and attributes for use in editing-related markup − del and ins.

Bidirectional Text Module - 双向文本模块定义了一个元素,该元素可用于为元素的内容声明双向规则——bdo。

Bidirectional Text Module − The Bi-directional Text module defines an element that can be used to declare the bi-directional rules for the element’s content − bdo.

Forms Module - 它提供 HTML 4.0 中找到的所有表单功能。具体来说,它支持——button、fieldset、form、input、label、legend、select、optgroup、option 和 textarea。

Forms Module − It provides all the form features found in HTML 4.0. Specifically, it supports − button, fieldset, form, input, label, legend, select, optgroup, option, and textarea.

Table Module - 它支持以下元素、属性和内容模型 - caption、col、colgroup、table、tbody、td、tfoot、th、thead 和 tr。

Table Module − It supports the following elements, attributes, and content model − caption, col, colgroup, table, tbody, td, tfoot, th, thead, and tr.

Image Module - 它提供基本的图像嵌入,并且可以独立地用于某些客户端图像映射实现。它支持元素——img。

Image Module − It provides basic image embedding and may be used in some implementations of client side image maps independently. It supports the element − img.

Client-side Image Map Module - 它为客户端图像映射提供元素——area 和 map。

Client-side Image Map Module − It provides elements for client side image maps − area and map.

Server-side Image Map Module - 它支持图像选择和选择坐标的传输。服务器端图像映射模块支持——img 上的属性 ismap。

Server-side Image Map Module − It provides support for image-selection and transmission of selection coordinates. The Server-side Image Map Module supports − attribute ismap on img.

Intrinsic Events Module - 它支持 XHTML 事件中讨论的所有事件。

Intrinsic Events Module − It supports all the events discussed in XHTML Events.

Meta information Module - 元信息模块定义了一个元素,该元素描述了文档的声明部分中的信息。它包括元素 meta。

Meta information Module − The Meta information Module defines an element that describes information within the declarative portion of a document. It includes element meta.

Scripting Module - 它定义了用于包含与可执行脚本或缺乏对可执行脚本的支持相关的信息的元素。此模块中包含的元素和属性有 - noscript 和 script。

Scripting Module − It defines the elements used to contain information pertaining to executable scripts or the lack of support for executable scripts. Elements and attributes included in this module are − noscript and script.

Style Sheet Module - 它定义了在声明内部样式表时使用的元素。此模块定义的元素和属性是 - style。

Style Sheet Module − It defines an element to be used when declaring internal style sheets. The element and attribute defined by this module is − style.

Style Attribute Module (Deprecated) - 它定义了 style 属性。

Style Attribute Module (Deprecated) − It defines the style attribute.

Link Module − 它定义了一个可以用来定义外部资源链接的元素。它支持链接元素。

Link Module − It defines an element that can be used to define links to external resources. It supports link element.

Base Module − 它定义了一个可以用来定义基 URI 的元素,文档中的相对 URI 将从此基 URI 进行解析。此模块中包含的元素和属性为 − base。

Base Module − It defines an element that can be used to define a base URI against which relative URIs in the document are resolved. The element and attribute included in this module is − base.

Ruby Annotation Module − XHTML 也使用了在 RUBY 中定义的 Ruby 注释模块,并支持 − ruby、rbc、rtc、rb、rt 和 rp。

Ruby Annotation Module − XHTML also uses the Ruby Annotation module as defined in RUBY and supports − ruby, rbc, rtc, rb, rt, and rp.

Changes from XHTML 1.0 Strict

本节描述了 XHTML 1.1 和 XHTML 1.0 Strict 之间的区别。XHTML 1.1 代表已从 HTML 4 和 XHTML 1.0 中删除的内容。

This section describes the differences between XHTML 1.1 and XHTML 1.0 Strict. XHTML 1.1 represents a departure from both HTML 4 and XHTML 1.0.

  1. The most significant is the removal of features that were deprecated.

  2. The changes can be summarized as follows −

  3. On every element, the lang attribute has been removed in favor of the xml:lang attribute.

  4. On the <a> and <map> elements, the name attribute has been removed in favor of the id attribute.

  5. The ruby collection of elements has been added.

XHTML - Tips & Tricks

本章列出了编写 XHTML 文档时应了解的各种提示和技巧。这些提示和技巧可帮助您创建高效的文档。

This chapter lists out various tips and tricks which you should be aware of while writing an XHTML document. These tips and tricks can help you create effective documents.

Tips for Designing XHTML Document

以下是设计 XHTML 文档的一些基本准则 −

Here are some basic guidelines for designing XHTML documents −

Design for Serving and Engaging Your Audience

在考虑满足受众需求时,您需要设计高效且引人注目的文档,以达到此目的。您的文档应便于查找所需信息,并提供一个熟悉的环境。

When you think of satisfying what your audience wants, you need to design effective and catchy documents to serve the purpose. Your document should be easy for finding required information and giving a familiar environment.

例如,学术界人士或医学从业者可以使用包含长句子、复杂图表、特定术语等类似日志的文档,而面向在校儿童的文档必须简单且提供信息。

For example, Academicians or medical practitioners are comfortable with journal-like document with long sentences, complex diagrams, specific terminologies, etc., whereas the document accessed by school-going children must be simple and informative.

Reuse Your Document

重复使用您先前创建的成功文档,而不是每次开始一个新项目时都从头开始。

Reuse your previously created successful documents instead of starting from scratch each time you bag a new project.

Inside the XHTML Document

以下是有关 XHTML 文档中元素的一些提示 −

Here are some tips regarding elements inside the XHTML document −

The XML Declaration

并非所有 XHTML 文档都需要 XML 声明,但极力建议 XHTML 文档的作者在所有文档中使用 XML 声明。当文档的字符编码不是默认 UTF-8 或 UTF-16 时,需要此类声明。

An XML declaration is not required in all XHTML documents but XHTML document authors are strongly encouraged to use XML declarations in all their documents. Such a declaration is required when the character encoding of the document is other than the default UTF-8 or UTF-16.

Empty Elements

它们在空元素的尾随 / 和 > 前包含一个空格。例如,<br />, <hr /> 和 <img src="/html/xhtml.gif" alt="xhtml" />。

They include a space before the trailing / and > of empty elements. For example, <br />, <hr />, and <img src="/html/xhtml.gif" alt="xhtml" />.

Embedded Style Sheets and Scripts

如果样式表使用 “<”、“&”、“]]>” 或 “—”,请使用外部样式表。

Use external style sheets if your style sheet uses “<”, “&”, “]]>”, or “—”.

如果脚本使用 “<”、“&”、“]]>” 或 “—”,请使用外部脚本。

Use external scripts if your script uses “<”, “&”, or “]]>”, or “—”.

Line Breaks within Attribute Values

避免属性值内出现换行符和多个空白字符。不同浏览器对此的处理不一致。

Avoid line breaks and multiple whitespace characters within attribute values. These are handled inconsistently by different browsers.

Isindex Element

文档的文档头中不得包含多个 isindex 元素。isindex 元素已被弃用,取而代之的是 input 元素。

Do not include more than one isindex element in the document head. The isindex element is deprecated in favor of the input element.

The lang and xml:lang Attributes

指定元素语言时,同时使用 lang 和 xml:lang 属性。xml:lang 属性的值优先。

Use both the lang and xml:lang attributes while specifying the language of an element. The value of the xml:lang attribute takes precedence.

Element Identifiers

XHTML 1.0 已弃用 a、applet、form、frame、iframe、img 和 map 元素的 name 属性。后续版本中将从 XHTML 中删除这些属性。因此,开始使用 id 元素进行元素标识。

XHTML 1.0 has deprecated the name attributes of a, applet, form, frame, iframe, img, and map elements. They will be removed from XHTML in subsequent versions. Therefore, start using id element for element identification.

Using Ampersands in Attribute Values

应当将&符号(“&”)表示为实体引用&。

The ampersand character ("&") should be presented as an entity reference &.

Example

<!-- This is invalid in XHTML -->
http://my.site.dom/cgi-bin/myscript.pl?class=guest&name=user.

<!-- Correct XHTML way of writing this is as follows -->
http://my.site.dom/cgi-bin/myscript.pl?class=guest&name=user

Whitespace Characters in HTML and XML

HTML 文档中合法的某些字符在 XML 文档中是非法的。例如,在 HTML 中,换页符字符(U+000C)被当作空白处理,而在 XHTML 中,由于 XML 中的角色定义,它是非法的。

Some characters that are legal in HTML documents are illegal in XML document. For example, in HTML, the form-feed character (U+000C) is treated as white space, in XHTML, due to XML’s definition of characters, it is illegal.

Named Character Reference &Apos;

已在 XML 1.0 中引入了命名字符引用”(即撇号,U+0027),但它未出现在 HTML 中。因此,Web 开发人员应使用 ' 而不是 ',以期按照 HTML 4 Web 浏览器的预期工作。

The named character reference ' (the apostrophe, U+0027) was introduced in XML 1.0 but does not appear in HTML. Web developers should therefore use ' instead of ' to work as expected in HTML 4 Web Browsers.

XHTML - Validations

每个 XHTML 文档都会针对文档类型定义进行验证。在正确验证 XHTML 文件之前,必须将正确的 DTD 作为文件的第一行或第二行添加。

Every XHTML document is validated against a Document Type Definition. Before validating an XHTML file properly, a correct DTD must be added as the first or second line of the file.

准备好验证 XHTML 文档后,可以使用 W3C 验证器来验证您的文档。此工具非常得心应手,可帮助您修复文档中的问题。此工具不需要任何专业知识来执行验证。

Once you are ready to validate your XHTML document, you can use W3C Validator to validate your document. This tool is very handy and helps you to fix the problems with your document. This tool does not require any expertise to perform validation.

文本框中的以下语句显示详细信息。您需要提供您想要验证的页面的完整 URL,然后单击 Validate Page 按钮。

The following statement in the text box shows you details. You need to give complete URL of the page, which you want to validate and then click Validate Page button.

输入您页面地址在下面的框中 −

Input your page address in the box below −

此验证器检查各种格式的 Web 文档的 markup validity ,尤其适用于 HTML、XHTML、SMIL、MathML 等。

This validator checks the markup validity of web documents with various formats especially in HTML, XHTML, SMIL, MathML, etc.

还有其他工具可以执行其他不同的验证。

There are other tools to perform different other validations.

XHTML - Summary

我们假设您理解了与 XHTML 相关的所有概念。因此,您应该能够将 HTML 文档编写到一个格式良好的 XHTML 文档中,并获得更干净的网站版本。

We assume you have understood all the concepts related to XHTML. Therefore, you should be able to write your HTML document into a well-formed XHTML document and get a cleaner version of your website.

Converting HTML to XHTML

您可以将现有的 HTML 网站转换为 XHTML 网站。

You can convert your existing HTML website into XHTML website.

让我们回顾一些重要的步骤。要转换现有的文档,您必须首先决定要遵守哪个 DTD,并在文档顶部包括文档类型定义。

Let us go through some important steps. To convert your existing document, you must first decide which DTD you are going to adhere to, and include document type definition at the top of the document.

  1. Make sure you have all other required elements. These include a root element <html> that indicates an XML namespace, a <head> element, a <title> element contained within the <head> element, and a <body> element.

  2. Convert all element keywords and attribute names to lowercase.

  3. Ensure that all attributes are in a name="value" format.

  4. Make sure that all container elements have closing tags.

  5. Place a forward slash inside all standalone elements. For example, rewrite all <br> elements as <br />.

  6. Designate client-side script code and style sheet code as CDATA sections.

XHTML Upcoming Versions

XHTML 仍在改进中,其下一版本 XHTML 1.1 已进入草案阶段。我们在 XHTML 版本 1.1 章节详细讨论了这一点。

Still XHTML is being improved and its next version XHTML 1.1 has been drafted. We have discussed this in detail in XHTML Version 1.1 chapter.

XHTML Tags, Characters, and Entities

XHTML 标签、字符和实体与 HTML 相同,因此,如果您已经了解 HTML,那么您不需要额外努力来学习这些学科,特别是对于 XHTML。我们已经列出了所有 HTML 内容,以及 XHTML 教程,因为它们也适用于 XHTML。

XHTML tags, characters, and entities are same as HTML, so if you already know HTML then you do not need to put extra effort to learn these subjects, especially for XHTML. We have listed out all HTML stuff along with XHTML tutorial also, because they are applicable to XHTML as well.

What is Next?

我们列出了 XHTML 和 HTML 的各种资源,因此,如果您有兴趣并且有时间,我们建议您阅读这些资源以增强您对 XHTML 的理解。否则,本教程一定为您提供了足够的知识,可以使用 XHTML 来编写您的网页。

We have listed out various resources for XHTML and HTML so if you are interested and you have time in hand, then we recommend you to go through these resources to enhance your understanding on XHTML. Otherwise this tutorial must have given you enough knowledge to write your web pages using XHTML.

您对本教程的反馈欢迎通过 contact@tutorialspoint.com 发送。

Your feedback on this tutorial is welcome at contact@tutorialspoint.com.