HTML 文本基础

这一节的内容非常基础，只需快速浏览熟悉即可

大部分文本结构由标题和段落构成。而内容的结构化会使读者的阅读体验更加轻松，更愉快

我们一共有六个标题元素 (heading) 标签：<h1> 表示主标题，<h2> 表示二级子标题，…，<h6> 为最小子标题；段落元素 (paragraph) 标签由 <p> 引导一个新的段落。请看下面这个例子：

See the Pen 文本基础 by KiritoShaw (@KiritoShaw) on CodePen.

有些时候我们在说话时会通过加强语气向对方传达一些重要讯息。在阅读中，我们也有类似的“加强语气”的方法，并且通过可视化的方式表现出来

<em> 元素标签可以实现斜体效果。下面的例子中，我们强调时间变化导致的情况的不同：

See the Pen emphasis by KiritoShaw (@KiritoShaw) on CodePen.

注意在强调内容结束后加上 </em>，否则你将得不到想要的结果。

<strong> 元素标签可以实现加粗效果，同样地，在强调的内容后面立刻补上 </strong>。下面的例子中，我们将一些好的表达进行加粗：

See the Pen strong by KiritoShaw (@KiritoShaw) on CodePen.

<u> 元素表示下划线。在以下例子中，我们划出一些生词：

See the Pen underline by KiritoShaw (@KiritoShaw) on CodePen.

无序列表用于标记列表项目顺序无关紧要的列表。列表由 <ul> 开始，同时列表中的每个项目由 <li> 引导：

See the Pen unordered list by KiritoShaw (@KiritoShaw) on CodePen.

有序列表需要按照项目的顺序列出来。这个标记的结构和无序列表一样，除了需要用 <ol> 元素将所有项目包裹，而不是 <ul>：

See the Pen ordered list by KiritoShaw (@KiritoShaw) on CodePen.

以下例子中用 <ul> 引导子列表的开始

See the Pen nesting lists by KiritoShaw (@KiritoShaw) on CodePen.

上述所说的所有标签均是有语义的元素，它们的出现会使人们自然地联想到相对应的项目。既然提到我们有有语义的元素，那么自然也有无语义的元素。<span> 和 <div> 就是两个很典型的无语义元素，其中 <span> 默认是内联元素，<div> 默认是块级元素。

我们可以通过设定 <span> 元素的 CSS (样式) 使其看起来像是一个标题，你可以通过调整字号的大小来看看效果的不同

See the Pen span by KiritoShaw (@KiritoShaw) on CodePen.

然而，由于它没有语义值，所以它不会有任何上文提到的帮助。最好的方法是使用相关的 HTML 元素来标记这个项目。