盒模型size计算

标准盒模型：

- 元素所占宽度=左外边距+左边框+左内边距+内容宽度+右内边距+右边框+右外边距

- 元素所占高度=上外边距+上边框+上内边距+内容高度+下内边距+下边框+下外边距

怪异盒模型：

- 设置的宽度 width = 左右 border + 左右 padding + 内容的宽度

- 设置的高度 height = 上下 border + 上下 padding + 内容的高度

- 注意：可能会导致内容溢出，需要时再使用

.d4{
      width: 100px;
      height: 100px;
      background-color: orange;
      /* 怪异模式 */
      box-sizing: border-box;
      padding: 10px;
      border: 10px solid #000;
    }