#块级元素**block**

    1. 多个块级元素会按照从上至下排列（每个元素独占一行，会自动换行）。
    2. 块级元素没有设置宽高时，宽度默认为父元素的100%，高度靠内容撑出。
    3. 任何的css样式对块级元素均有效。

    #行内元素inline

    1. 多个相邻的的行内元素会按照从左至右排列（元素不会换行）。
    2. 行内元素设置宽高无效（宽度高度靠文本内容撑出）
    3. 设置margin时，上下无效，左右有效（左右magin不会合并）。

    #行内块元素inline-block

    1. 行内块元素会按照从左至右的顺序排列。
    2. 行内块设置宽高和任何的css样式均有效。

    注意：当多个行内块元素在一行显示，缩小视图窗口时会从超出宽度的元素部分自动换行。

    元素之间的转换：
    display：block； 转换为块级元素（转换后具有块级元素的所有特性）
    display：inline； 转换为行内元素（转换后具有行内元素的所有特性）
    display：inline-block； 转换为行内块元素（转换后具有行内块元素的所有特性）
    dispaly：none; 清除该元素（元素彻底消失，浏览器不会解析，使用后元素不会在文档流中占据位置）

    • visibility：hidden; 隐藏该元素（文档流中依然存在该元素，浏览器会解析，会被子元素继承）
    • visibility：visible; 显示元素
    • visibility：collapse; 在表格中使用，此值可删除一行或一列，不影响表格布局，删除后内容留给其他内容使用

    为什么行元素和行内块元素之间会有间距？
    HTML代码在书写的时候为了保持美观，每个元素会单独写一行，所以元素之间会有空格和回车。
    这些空格和回车在页面解析中会被解析为一个空格，间隙就是这个空格造成的
    解决方法：
    1.清除元素之间的空格和回车，例如将下一行的开始标签写在上一行的尾部。
    2.在文本的最后面加空格（只针对行内文本标签）。
    3.给元素设置margin进行移动4px左右

    为什么行元素和行内块元素之间会有间距？
    HTML代码在书写的时候为了保持美观，每个元素会单独写一行，所以元素之间会有空格和回车，
    这些空格和回车在页面解析的时候会解析为一个空格，间隙就是这个空格造成的
    解决方法：

    1. 清除元素之间的回车和空格，例如将下一行的开始标签写在上一行的尾部。
    2. 在文本的后面添加空格(针对文本标签元素)。
    3. 给元素添加外边距抵消整间隙。

    vertical-align:基线的对齐方式
    middle: 中线对齐。
    top：顶部对齐。
    bottom：底部对齐。
    baseline：文本基线对齐(四线三格的第三条线)。
    auto：默认值，按照浏览器的默认状态执行。
    基线对齐：
    正常情况是为了让文本和图片进行对齐。
    两个或多个元素在一行显示，会按照默认的对齐规则对齐(基线对齐)。
    什么是基线：
    图片的和空块的基线是在元素的底部，文本的基线是在文本的中下部分(四线三格的第三条线)。
    注意：元素中带有文本，默认其元素的基线以文本的基线为准。