块标签、行内块标签、行内标签的详细特点

标签的作用：

    1. 圈定页面范围，划分页面结构：通过样式实现
    2. 标记实际内容，添加某些功能：通过属性实现

块标签的特点

<h3>块标签的特点</h3>
<ol>
    <li>代表性标签：div,main,header,h2,ol,ul,li...</li>
    <li>默认的宽度是占据父标签内容的全部，也就是 width: 100%;
        默认的高度内容的多少决定</li>
    <li>可以设置宽高</li>
    <li>块标签会独立的占据一行，不会和其他默认样式元素同行</li>
</ol>

行内标签的特点

<h3>行内标签的特点</h3>
<ol>
    <li>代表性的标签：span,a,b,i,em,u....</li>
    <li>默认的宽高由内容决定</li>
    <li>内容过多时允许换行并断开（一般都是用于处理文字样式）</li>
    <li>不可以直接设置宽高（宽高无效）</li>
    <li>在一行中如有剩余空间，允许同其他 行内/行内块 标签公用一行</li>
    <li>上下方向外边距不能使用</li>
    <li>某些动画样式不能添加使用</li>
</ol>

行内块标签的特点

<h3>行内块标签的特点</h3>
<ol>
    <li>代表性标签：img,button,input...</li>
    <li>默认的宽高由内容决定</li>
    <li>内容过多时不会断开</li>
    <li>可以设置宽高</li>
    <li>在一行中如有剩余空间，允许同其他 行内/行内块 标签公用一行</li>
    <li>行内块和内行标签会有行高的概念</li>
</ol>