标题与段落

<h1>顶级标题</h1>
<h2>二级标题</h2>
<h3>三级标题</h3>
<h4>四级标题</h4>
<h5>五级标题</h5>
<h6>六级标题</h6>
<p>段落</p>

效果如下

顶级标题

二级标题

三级标题

四级标题

五级标题

六级标题

段落

列表

列表分为无序列表(Unordered Lists)和有序列表(Ordered Lists)，以及自定义列表

无序列表

<ul>
  <li>元素一</li>
  <li>元素二</li>
  <li>元素三</li>
  <li>元素四</li>
</ul>

效果如下

元素一
元素二
元素三
元素四

有序列表

<ol>
  <li>元素一</li>
  <li>元素二</li>
  <li>元素三</li>
  <li>元素四</li>
</ol>

效果如下

元素一
元素二
元素三
元素四

列表是可以嵌套的，比如在有序列表的<li>标签中嵌套一个无序列表或者有序列表都是可行的

自定义列表

<dl>
   <dt>计算机</dt>
   <dd>用来计算的仪器</dd>
   <dd>CPU</dd>
   <dt>显示器</dt>
   <dd>以视觉方式显示信息的装置</dd>
</dl>

浏览器的默认样式会在描述列表的描述部分 (description description) 和描述术语 (description terms) 之间产生缩进，效果如下

计算机: 用来计算的仪器; CPU
显示器: 以视觉方式显示信息的装置

表格

<table border="1"cellpadding="10" cellspacing="10" bgcolor="yellow"  frame="box">
<!-- 定义表格，表的边框、单元格边距、单元格间距 、背景颜色、框架属性-->
    <caption>我的标题</caption><!-- 定义标题-->
    <tr><!-- 定义行-->
        <th>表头</th><!-- 定义表头-->
        <th colspan="2">信息</th> <!-- 定义表头,跨两列-->
    </tr>
    <tr>
        <td>单元格内容</td><!-- 定义单元格内容和背景-->
        <td>信息1</td>
        <td>信息2</td>
    </tr>
</table>

我的标题
表头	信息
单元格内容	信息1	信息2

引用

块引用

1
2
3

<blockquote>
    块引用
</blockquote>

块引用

浏览器在渲染块引用时默认会增加缩进，作为引用的一个指示符

行内引用

1	<q>行内引用</q>

行内引用

特殊文本样式

文本强调

1 2	<strong>粗体</strong> <em>斜体</em>

效果如下

粗体
斜体

缩略 <abbr>

1	<p>我们使用 <abbr title="超文本标记语言（Hyper text Markup Language）">HTML</abbr> 来组织网页文档。</p>

我们使用 HTML 来组织网页文档。

上下标 <sup> 和 <sub>

1	<p>x<sup>2</sup>+y<sub>2</sub></p>

x²+y₂

计算机代码

<code>
<pre>
    cout << "hello world" << endl;
</pre>
</code>


<pre>
    所见
        即所得
</pre>

<var>变量名</var>

<kbd>Ctrl</kbd>+<kbd>V</kbd>

<samp>计算机程序输出</samp>