CSS盒模型

• 盒子的组成：内容content、内边距padding、边框border、外边距margin
• 盒模型的类型：
• 标准盒模型： 组成部分：margin + border + padding + content
• IE盒模型 组成部分：margin + content(border + padding)
• 控制盒模型的模式：box-sizeing：content-box(默认值，标准盒模型) 和 border-box(IE盒模型)

  <style>
    .box{
      padding: 10px;
      width: 200px;
      height: 200px;
      border: 3px solid;
      background-color: pink;
      margin: 70px auto;
    }
    .box1{
      box-sizing: content-box; 
    }
    .box2{
      box-sizing: border-box;
    }
  </style>
<div class="box1">标准盒模型</div>
<div class="box2">IE盒模型</div>