css盒子模型的理解

一、盒模型的概念
盒模型是Css的基石，他规定元素的显示规则以及元素之间的相互关系，控制元素和元素之间，或者元素和内容之间的关系。
二、盒模型的组成
盒模型的组成：content（内容）+padding（填充区）+border（边框）+margin（外边距）

padding：作用：1、控制父元素和子元素的位置显规则2、控制元素和内容元素的显示
1、 特点：1、添加了padding之后，会把原有元素撑大，

2、 背景色会延伸到padding区域
Margin：作用：控制同辈元素的位置关系
特点：1、是在元素边框以外的空白区
2、 可以写负值，padding不可以写
三、盒模型的分类
1、 标准盒模型：宽高是控制内容（content）区域的大小
2、 怪异盒模型：宽高是控制内容（content）+边框（border）+填充区（padding）区域的大小