CSS box-model

  • Margin(外边距) - 清除边框外的区域,外边距是透明的。
  • Border(边框) - 围绕在内边距和内容外的边框。
  • Padding(内边距) - 清除内容周围的区域,内边距是透明的。
  • Content(内容) - 盒子的内容,显示文本和图像。

    宽度和高度

    css 内定义的宽(width)和高(height),指的是填充以里的内容范围。
    但一个元素的实际宽度(盒子的宽度) = 左边界 + 左边框 + 左填充 + 内容宽度 + 右填充 + 右边框 + 右边界。