HTML的元素家族

要想熟练掌握HTML，不光要知道它拥有哪些元素，还要搞清楚这些元素属于什么类型，这样才能有利于我们更好的利用这门知识。
那么在HTML里面，有哪些常见的元素分类呢？常见的分类有下面这些

1. 块级元素
2. 行内元素
3. 可替换元素
4. 空元素
   下面我们就来逐一了解吧！

块级元素

块级元素占据其父元素（容器）的整个空间，因此创建了一个“块”。通常浏览器会在块级元素前后另起一个新行。
<address>联系方式信息。
<article>5文章内容。【HTML5】
<aside> 伴随内容。【HTML5】
<audio> 音频播放。【HTML5】
<blockquote>块引用。
<canvas>绘制图形【HTML5】
<dd>定义列表中定义条目描述。
<div>文档分区。
<dl>定义列表。
<fieldset>表单元素分组。
<figcaption>图文信息组标题【HTML5】
<figure>图文信息组 (参照<figcaption>)【HTML5】
<footer>区段尾或页尾【HTML5】
<form>表单。
<h1>, <h2>, <h3>, <h4>, <h5>, <h6>标题级别 1-6.
<header>区段头或页头【HTML5】
<hgroup>标题组【HTML5】
<hr>水平分割线。
<noscript>不支持脚本或禁用脚本时显示的内容。
<ol>有序列表。
<output>表单输出【HTML5】
<p>行。
<pre>预格式化文本。
<section>一个页面区段【HTML5】
<table>表格。
<tfoot>表脚注。
<ul>无序列表。
<video>视频【HTML5】

行内元素

一个行内元素只占据它对应标签的边框所包含的空间

• 【字体相关】
  <b>``<big> <i>``<small>``<tt>
• 【文本相关】
  <abbr>``<acronym>``<cite>``<code>``<dfn>``<em>``<kbd>``<strong>``<samp>``<var>
• 【引用相关】
  <a>``<bdo>``<br>``<img>``<map>``<object>``<q>``<script>``<span>``<sub>``<sup>
• 【输入选择相关】
  <button>``<input>``<label>``<select> ``<textarea>

空元素

在 HTML 中，通常在一个空元素上使用一个闭标签是无效的。
<area>
<base>
<br>
<col>
<colgroup> 【当span存在时】
<command>【已废弃使用】
<embed>
<hr>
<img>
<input>
<keygen>【已废弃使用】
<link>
<meta>
<param>
<source>
<track>
<wbr>

可替换元素【css内容】

这些元素是一类 外观渲染独立于CSS的 外部对象

典型的可替换元素有<img> <object> <video> 和 表单元素，如<textarea> <input> 。
某些元素只在一些特殊情况下表现为可替换元素，例如 <audio> 和 <canvas> 。
通过 CSS content 属性来插入的对象 被称作 匿名可替换元素（anonymous replaced elements）。CSS在某些情况下会对可替换元素做特殊处理，比如计算外边距和一些auto值。需要注意的是，一部分（并非全部）可替换元素，本身具有尺寸和基线（baseline），会被像vertical-align之类的一些 CSS 属性用到。

参考网站[MDN][a]

——远方不远
[a]: https://developer.mozilla.org/zh-CN/