编写网页时,你在页面的内容中添加标签(也称为标记)。这些标签表达了特定的含义并指示浏览器向用户呈现出合理的页面结构。

标题和段落

标题

HTML中的标题有6个级别:它们分别是

<h1>   <h2>   <h3>    <h4>     <h5>     <h6>

其中<h1>用在主标题上,<h2>用在子标题上,如果子标题下还有分段,就可以使用元素<h3>,以此类推。
浏览器使用不同的字号赖显示这些标题中的内容,<h1>元素中的内容字号最大,<h6>元素中的内容字号最小。每种浏览器显示标题的大小会略有不同。

段落

在成段的文字两段分别添加起始标签<p>和结束标签</p>就构成了HTML所指的段落。
默认情况下,浏览器在显示段落会另起一行并与后续段落保持一定的距离。

粗体,斜体,强调

粗体和斜体

<b>

通过将文字包含在标签<b>和</b>之间,我们可以将这些文字显示为粗体。
尽管使用<b>元素并不意味着其他特殊含义,但它可以在外观上将其中文字以粗体文字形式凸显出来。(例如段落中的关键字)

<i>

通过将文字包含在标签<i>和</i>之间,我们可以将这些文字显示为斜体。
<i>元素可以将一部分文本在格式上以不同于周围内容的方式显示---例如技术词语,轮船名称,外语单词,思想理论或其他术语通常会以斜体显示。

上标和下标

<sup>    <sub>   

<sup>元素用来标记作为上标的字符,例如日期后缀或者像\(2^2\)这样表示幂的数学概念。
<sub>元素用来标记作为下标的字符,它通常用在脚注或者像\(H_2\)O这样的化学式中。
eg:

<p> On the 4<sup>th</sup> of Setember you will learn about E=MC<sup>2</sup>.</p>
<p> The amount of CO<sub>2</sub> in the atmosphere grew 2ppm in 2019<sub>1</sub>.</p>

效果如下图:

空白

为了增强代码的可读性,设计人员经常通过补充空格或者换行的方式来编写代码。当浏览器遇到两个或两个以上的连续空格时,只将其显示为一个空格。同样,当遇到一次换行时,浏览器也会将其看作一个空格,这一特性称为白色空间折叠。通过白色空间折叠可以很好地控制代码格式来保证代码具有良好地可读性。

换行符和水平线

<br />

如你所见,浏览器在显示另一个段落或标题时会自动换行。但如果你想在段落中的某个位置加入换行符,可以使用换行标签<br />。
eg:

<p>  The Earth <br />gets one hundred tons 
heavier
     every day <br />due to falling space dust.</p>

效果如下图:

<hr />

在不同的主题间进行分割时--例如在书中改变话题或者在剧本中切换场景--你可在不同的部分间使用<hr />标签来插入一条水平线。

<p>Good good study</p>
<hr />
<p>Day day up</p>

语义化标记

有一些文本元素,它们不影响网页结构,却为所在页面添加了额外信息---这些元素称为语义化标记。

<strong>

<strong>元素的作用是表示其中的内容十分重要。具体在网页中的显示为粗体。

<em>

<em>元素的作用是起强调作用,在网页中显示为斜体。

<cite>

当你引用一部作品时(可以是书籍,电影或研究报告等),<cite>元素可以用来表明引用的来源。
浏览器会把<cite>元素中的内容显示为斜体。

<dfn>

当你在文档中第一次显示一些新术语时(可能是学术概念或者是行业用语),会给出它的定义。
<dfn>元素用来表示一个新术语的定义。
有些浏览器会使用斜体来表示<dfn>中的内容,而Safari和Chrome浏览器则不会改变其外观。

<address>
<address>元素有一个非常特殊的用途:包含页面设计者的联系详情。 它可以包含一个物理地址,但并非是必需的。例如,它可能包含一个电话号码或电子邮箱地址。 浏览器通常将<address>元素中的内容显示为斜体。 你可能还会对一种称为hCard的微格式感兴趣,通过它可以向你的标记添加物理地址信息。

内容的修改

<ins>   <del>

<ins>元素用来显示已经插入到文档中的内容,而<del> 元素用来显示已经从文档中删除的文本。
<ins>元素中的内容通常带有下划线。而<del>中的内容则带有删除线。
eg:

<html>
  <body>
    <h1>卜算子·我住长江头</h1>
       <p>我住长江头,<ins>君住长江尾</ins>。<del>日日思君</del>不见君,共饮长江水。
          此水几时休,此恨何时已。只愿君心似我心,定不负相思意。</p>
  </body>
</html>

小结

1.HTML元素用来描述页面的结构(例如标题、子标题和段落)。

2.HTML元素还提供语义信息(例如在什么位置着重强调、所使用的缩略语定义、给定的文本何时是一个引用)。

</address></address>