使用 Dojo 的 Ajax 应用开发进阶教程，第 2 部分 : 富含语义的 H(2)_H5之家

富含语义的 HTML 为 Ajax 应用提供了描述结构的最佳方式。在开发 Ajax 应用时，从一系列富含语义的 HTML 文档出发，将为后面的开发打下良好的基础。HTML 规范中元素和属性众多，而富含语义的 HTML 的实践则推荐使用 HTML 规范中表示文档结构和富含语义的元素和属性。下面将详细介绍这些推荐使用的元素和属性，同时也会讨论那些不建议使用的与展示相关的元素和属性，并说明如何用 CSS 替换它们。

HTML 元素与属性

下面将介绍 HTML 4.01 规范中的一些重要的元素与属性。这些元素与属性大致上分成两类，一类是表示文档结构和富含语义的，是推荐使用的；另一类是与文档的展示相关的，是不推荐使用的，而应该用 CSS 来实现相应的展示效果。

文档结构和富含语义的元素

文档结构和富含语义的元素的介绍见。

表 1. 文档结构和富含语义的元素介绍

元素说明

<h1>、<h2>、<h3>、<h4>、<h5> 和 <h6><h1>、<h2>、<h3>、<h4>、<h5> 和 <h6> 等六个元素用来表示不同级别的标题。<h1> 表示重要性最高的，<h6> 表示重要性最低的。浏览器对于不同重要性的标题会有默认的显示样式，一般是通过字体大小来区分。当需要表示文档中每个部分的标题时，推荐使用这六个元素。

<p><p> 元素用来表示文档中的一个段落。HTML 文档中的自然段落推荐使用该元素来表示。

<em>、<strong><em> 和 <strong> 两个元素用来表示对文档中文本的强调。在强调性方面，<strong> 要高于 <em>。浏览器一般把 <em> 中的文本显示为斜体，把 <strong> 中的文本显示为粗体。

<abbr>、<acronym><abbr> 和 <acronym> 元素用来表示缩写词，其中 <abbr> 表示一般的缩写词，如“Inc.”是“incorporated”的缩写；而 <acronym> 表示由首字母组成的缩写词，如“UN”是“United Nations”的缩写。这两个元素的文本是缩写词本身，一般通过 title 属性来说明完整的词组。如 <acronym title="United Nations">UN</acronym>。

<blockquote>、<q><blockquote> 和 <q> 元素用来表示文档中的引用。如果在文档中需要引用其它人说过的话或是来自其它文献资料的内容，应该使用这两个元素。<blockquote> 用来表示较长的引用，一般自成一个段落；<q> 则表示较短的引用，一般嵌在原始文本中。两个元素的 cite 属性用来给出引用文本的出处（URI）。浏览器通常会把 <blockquote> 显示在缩进的块中，会为 <q> 元素的内容添加引号。下面给出两个元素的示例：<blockquote uri="http://americancivilwar.com/north/lincoln.html">Four score and seven years ago our fathers brought forth, upon this continent, a new nation, conceived in Liberty, and dedicated to the proposition that all men are created equal.</blockquote>；<p>As Abraham Lincoln said, <q>all men are created equal</q>.</p>

<ul>、<ol>、<li><ul> 和 <ol> 元素用来表示列表型的内容。<ul> 表示的是无序列表；<ol> 表示的是有序列表；<li> 表示列表中的条目。

<dl>、<dt>、<dd><dt> 和 <dd> 元素分别表示术语及其描述。<dl> 表示 <dt> 和 <dd> 对的列表。

<cite><cite> 元素表示对外部资料的引用。与 <blockquote> 和 <q> 元素不同的是，<cite> 里面包含的是资料的名称，而不是内容。如 <cite>JavaScript 高级程序设计 </cite>

<code><code> 元素表示程序源代码。如果需要在 HTML 文档中嵌入一段计算机代码，应该使用该元素。如 <code>System.out.println("Hello World!");</code>

与展示相关的元素和属性

与展示相关的元素和属性的介绍见。中给出了相应的 CSS 替代实现方式。

表 2. 展示相关的元素和属性介绍

元素或属性说明替代实现

<center><center> 元素用来将文档中的一个部分居中显示。将一个元素水平居中显示的方式有很多。其中一种做法是使用自动空白边，即：{margin : 0 auto;}

<font><font> 元素用来设置文本的字体。如 <font size=12>Font</font> 使用 CSS 来实现：{font : bold 12px;}

<strike>、<s><strike> 和 <s> 元素用来实现在文本中间划线的效果。如 <strike>Sample</strike>。使用 CSS 来实现：{text-decoration:line-through;}

<u><u> 元素用来实现在文本下添加下划线的效果。如 <u>Sample</u> 使用 CSS 来实现：{text-decoration:underline;}

<b><b> 元素用来实现文本加粗的效果。使用 CSS 来实现：{font-weight : bold;}

<i><i> 元素用来实现文本倾斜的效果。使用 CSS 来实现：{font-style: italic;}

<tt><tt> 元素用来表示与打字机效果一样的等宽字体显示。如 <tt>Sample</tt> 使用 CSS 中的 font 来设置等宽字体。

<big><big> 元素用来使得文本的字体变大。使用 CSS 来实现：{font-size : 200%;}

<small><small> 元素用来使得文本的字体变小。使用 CSS 来实现：{font-size : 50%;}

<hr><hr> 元素用来在页面上添加一条水平线。可以用 <div> 元素代替 <hr>。通过设置 <div> 的大小和背景颜色来达到同样的效果。

@colorcolor 属性用在 <font> 中用来表示字体的颜色。使用 CSS 来实现：{color : red;}

@bgcolorbgcolor 属性用来设置元素的背景颜色。使用 CSS 来实现：{background-color : red;}

@alignalign 属性用来设置元素内容的水平对齐方式。根据所应用的元素的不同，其可选的值也不同。需要根据不同的元素选用不同的 CSS 样式。一般情况下，可以用 text-align 来代替。

@valignvalign 属性用来设置表格中一行的垂直对齐方式。根据属性的值不同，使用不同的 CSS。如 valign = bottom 的情况，可以采用绝对定位并设置 bottom 为 0 来实现。

@face, @sizeface 和 size 都是 <font> 元素的属性，分别用来表示字体家族和大小。使用 CSS 来实现：{font-family : verdana; font-size : 12px;}