3.1 使用元素

代码清单3-1是一个应用于文本内容的HTML元素的简例。

代码清单3-1 HTML元素示例

        I like<code>apples</code>and oranges.

这里用粗体标明元素。该元素分为三部分。其中有两部分称为标签（tag）：开始标签<code>和结束标签</code>。夹在两个标签之间的是元素的内容（本例中为单词apples）。两个标签连同它们之间的内容构成code元素。其结构剖析见图3-1。

元素是一种用来向浏览器说明文档内容的工具。其效果体现在内容之上。不同的元素有不同的确切含义。例如，前述code元素代表的是计算机代码片段。

HTML定义了各种各样的元素，它们在HTML文档中起着各不相同的作用。code元素是语义元素的一个例子。语义元素可以用来说明内容的含义以及内容的不同部分之间的关系。第8章还会对此做进一步说明。下面的图3-2显示了code元素的效果。

注意，浏览器不会显示元素的标签，它的任务是解读HTML文档，然后向用户呈现一个体现了HTML元素作用的视图。

将内容与呈现分开

有些HTML元素会对呈现形式产生影响。浏览器遇到这种元素时，会改变向用户呈现文档内容的方式。code元素就是一例。浏览器遇到该元素时，会用等宽字体显示元素的内容，这可以从图3-2中看出来。

用HTML元素控制内容呈现形式的做法如今受到强烈反对。现在的观点是应该用HTML元素说明文档内容的结构和含义，用CSS（第4章将会介绍）控制内容呈现给用户的形式。

会影响呈现形式的那些元素通常产生于HTML的早期版本，当时将内容与其呈现形式分开这个理念尚未像如今一样得以严格实施。这些元素在浏览器中呈现时有默认的呈现样式（例如code元素通常使用等宽字体），不过可以用CSS改变其默认样式。第4章会谈到这个问题。

3.1.1 了解本章用到的元素

为了让读者对HTML有个初步的认识，我需要用到一些后面各章中才会讲到的元素。表3-2列出了这些元素及其简要说明，还有其全面说明所在的章编号。

3.1.2 使用空元素

元素的开始和结束标签之间并非一定要有内容。没有内容的元素称为空元素。代码清单3-2所示就是一例。

代码清单3-2 空HTML元素

        I like<code></code>apples and oranges.

有些元素为空时没有意义（code就是其中之一），即便如此，它也是有效的HTML代码。

3.1.3 使用自闭合标签

空元素可以更简洁地只用一个标签表示。如代码清单3-3所示。

代码清单3-3 只用一个标签表示空元素

        I like <code/> apples and oranges.

此例将开始标签和结束标签合二为一。通常用来表示结束标签开始的斜杠符号（/）在此被放到标签的末尾。代码清单3-2和代码清单3-3中的元素等价，但只用一个标签的表示法更为简洁。

3.1.4 使用虚元素

有些元素只能使用一个标签表示，在其中放置任何内容都不符合HTML规范。这类元素称为虚元素（void element）hr就是这样一个元素。它是一种组织性元素（第9章将介绍一些其他的这类元素），用来表示内容中段落级别的终止。虚元素有两种表示法。第一种只使用开始标签，如代码清单3-4所示。

代码清单3-4 用单个开始标签表示虚元素

        I like apples and oranges.
<hr>
        Today was warm and sunny.

浏览器知道hr是虚元素，所以不会等待其结束标签出现。第二种表示法在此基础上加了一个斜杠符号，其形式与空元素一致，如代码清单3-5所示。

代码清单3-5 用空元素结构表示虚元素

        I like apples and oranges.
<hr />
        Today was warm and sunny.

我更喜欢这种表示法，并且会在本书中采用。顺便提一句，hr元素也是一个具有呈现形式含义的元素，它会显示为一条横线（这也是其名称的由来）。在图3-3中可以看到hr元素的默认表现形式。

用不用非强制使用的开始和结束标签

许多HTML5元素在某些条件下可以省略其中一个标签。例如，html元素（第7章将会讲到）的结束标签在此情况下就可以省略：“该元素后面没有紧跟着一条注释，且该元素包含着一个非空或者其开始标签未曾省略的body元素”。这段引文出自一份正式的HTML5规范文档。你不妨读读这些规范（可从w3c.org获得），但是要注意：它们都是以这样一种“活泼”的风格写就。

标记语言能有这种灵活性挺棒，不过这也会把人弄糊涂，而且会给维护工作带来麻烦HTML文档并非只由浏览器处理，你的同事和未来的你（在以后回头修整和升级自己的应用程序时）也会阅读它们。浏览器也许能明白某个标签为什么会被省略，但你的同事未必能轻松看出来，就算你自己以后回头修改代码也是如此。出于这个原因，本书不会详述前面所说的那些特殊规定，除非有必要破例（届时会有解释），否则书中的元素都会有开始和结束标签。