WTF HTML极简教程: 3. 常用文本标签
WTF HTML教程,帮助新人快速入门HTML。
推特:@WTFAcademy_ | @0xAA_Science
WTF Academy社群: 官网 wtf.academy | WTF Solidity教程 | discord | 微信群申请
所有代码和教程开源在github: github.com/WTFAcademy/WTF-HTML
HTML 提供了大量的文本标签,以供我们在制作网页时使用。这些标签可以帮助我们更好地组织和格式化我们的文本内容。以下是一些常用的 HTML 文本标签。
<p>
:段落标签
<p>
标签用于定义一个段落。它会在前后各添加一个换行,使得段落之间有明显的区分。
<p>这是一个段落。</p>
<p>这是另一个段落。</p>
浏览器中效果:
这是一个段落。
这是另一个段落。
<h1>
到 <h6>
:标题标签
这些标签用于定义 HTML 标题。<h1>
定义最大的标题,<h6>
定义最小的标题。
<h1>这是一个 h1 标题</h1>
<h2>这是一个 h2 标题</h2>
...
<h6>这是一个 h6 标题</h6>
浏览器中效果:
这是一个 h1 标题
这是一个 h2 标题
...这是一个 h6 标题
<br>
:换行标签
<br>
标签用于插入一个简单的换行符。
<p>这是一个段落。<br/>这是同一个段落的新一行。</p>
浏览器中效果:
这是一个段落。
这是同一个段落的新一行。
<strong>
:加粗标签
<strong>
标签用于定义强调文字,浏览器通常会将其显示为粗体。
<p>这是一个<strong>加粗</strong>的文字。</p>
浏览器中效果:
这是一个加粗的文字。
<em>
:斜体标签
<em>
标签用于定义强调文字,浏览器通常会将其显示为斜体。
<p>这是一个<em>斜体</em>的文字。</p>
浏览器中效果:
这是一个斜体的文字。
<u>
:下划线标签
<u>
标签用于定义下划线文本。
<p>这是一个<u>带下划线</u>的文字。</p>
浏览器中效果:
这是一个带下划线的文字。
<del>
:删除线标签
<del>
标签用于展示已经被删除的文字,浏览器通常会在其上添加一条横线。
<p>这是一个<del>已删除</del>的文字。</p>
浏览器中效果:
这是一个已删除的文字。
<mark>
:高亮标签
<mark>
标签用于定义标记或高亮的文本。
<p>这是一个<mark>高亮</mark>的文字。</p>
浏览器中效果:
这是一个高亮的文字。
<sub>
和 <sup>
:下标和上标标签
<sub>
用于定义下标文本,<sup>
用于定义上标文本。
<p>这是一个<sub>下标</sub>和<sup>上标</sup>的例子。</p>
浏览器中效果:
这是一个下标和上标的例子。
总结
这一讲我们介绍了一些常用的 HTML 文本标签,合理使用这些标签可以帮助我们更好地组织和展示我们的网页内容。