标签的另一种分类方式-按照显示模式划分
HTML标签一般分为块标签和行内标签两种类型，也被称为块元素和行内元素
块元素 block
每个块元素通常都会独自占据一整行或者多行，可以对其设置宽、高、对齐方式等属性，常用于页面的布局结构搭建。最典型的块元素是div，也是最常用的，块中之王。其次还有
<h1>到<h6>、<p> 、<ul>、<ol> 、<li>等。
特点：
- 独自占用一行
- 可设置宽高，默认宽度为容器的100%
div 中可以放 div、span、img标签
p 和h1-6 只有文字组成的里面不能放其他块元素。
行内元素 inline
不占有独立的区域，仅仅靠自身的字体大小和图像尺寸来支撑结构，一般不能设置宽、高、对齐方式等属性，通常用于控制页面中文本的样式，<span> 是最典型的行内元素，其他常见的行内元素还有：
<a> <strong> <b> <em> <i> <del> <s> <ins> <u>
行内元素特点是：
- 和相邻的行内元素在同一行上展示
- 不能设置宽高，但是水平方向的padding和margin可以设置，垂直方向的却不可以
- 默认宽度就是它内容本身的宽度
- 只能容纳文本或者其他的行内元素 （但是 a 是比较特殊的）
span 中可以放 span、 b、 u、 a、 img 等行内元素
a里面不能放a，但是a里可以放块元素
行内块元素 inline-block
有几个特殊的标签：<img /> 、<input />、 <td> ， 可以对它们设置高度和对齐属性。
特点：
- 和相邻行内元素在同一行上，但是之间会有空白缝隙；
- 默认宽度就是它本身内容的宽度
- 高度、行高、外边距以及内边距都可以控制；
标签显示的模式是可以转换的，块元素与行内元素是可以相互转换的，通过CSS 中的display属性来控制：
- 块转行内： display:inline;
- 行内转块：display:block;
- 块、行内转为行内块： display:inline-block;
先看一下块元素转行内元素的例子，下面是正常的块元素div展示方式
当我们把它设置display属性为inline时，如下图所示：
我们可以看到代码中width和height有波浪线提醒，鼠标移上去会有如下提示：
它的意思display的值为inline时，宽高属性不受影响，也就是不受控制了，所以div它的展现方式就变成了行内样式。
行内元素转块元素以span为例：
行内元素转行内块元素，以<a>为例：
