• CSS学习（2）-盒子模型

    1. CSS 长度单位

    1. px ：像素。
    2. em ：相对元素 font-size 的倍数。
    3. rem ：相对根字体大小，html标签就是根。
    4. % ：相对父元素计算。

    注意： CSS 中设置长度，必须加单位，否则样式无效！

    2. 元素的显示模式

    2.1 块元素（block）

    特点：

    1. 在页面中独占一行，不会与任何元素共用一行，是从上到下排列的。
    2. 默认宽度：撑满父元素。
    3. 默认高度：由内容撑开。
    4. 可以通过 CSS 设置宽高。

    常见的如下：

    1. 主体结构标签： 、
    2. 排版标签：

      ~

      、
      、

      、 

       、
    3. 列表标签：
        、
          、
        1. 、
          、
          、
        2. 表格相关标签： 、 、 、 、 、
        3. 与

          4. 2.2 行内元素（inline）

          特点:

          1. 在页面中不独占一行，一行中不能容纳下的行内元素，会在下一行继续从左到右排
            列。
          2. 默认宽度：由内容撑开。
          3. 默认高度：由内容撑开。
          4. 无法通过 CSS 设置宽高。

          常见的如下：

          1. 文本标签：
            、 、 、 、 、 、
          2. 与

          2.3 行内块元素（inline-block）

          特点：

          1. 在页面中不独占一行，一行中不能容纳下的行内元素，会在下一行继续从左到右排
            列。
          2. 默认宽度：由内容撑开。
          3. 默认高度：由内容撑开。
          4. 可以通过 CSS 设置宽高。

          常见的如下：

          1. 图片：
          2. 单元格：
          、
        4. 表单控件： 、