一个盒子中主要的属性就5个：width、height、padding、border、margin。

width是“宽度”的意思，CSS中width指的是内容的宽度，而不是盒子的宽度。

height是“高度”的意思，CSS中height指的是内容的高度，而不是盒子的高度

padding是“内边距”的意思

border是“边框”

margin是“外边距”

下面就是盒模型的属性的值

这里我们定义一个div

Document

div{

width: 200px;

height: 200px;

padding: 10px;

border:6px solid red;

}

上述代码，我们设置width=200px，height: 200px;但是盒子占据的真实的宽度和高度是200+10*2+6*2=232.即232*232。