盒子模型

html元素都可以看成是一个盒子，整个盒子模型在页面中占用的宽度=左边界+左边框+左填充+内容+右填充+右边框+右边界

内容：盒子模型的内容，包括文本或图像。内容部分的宽度在css中使用width定义

填充：盒子模型边框和内容之间创建的透明空间称为padding内边距，不可以设置颜色和任何装饰，但是可以呈现背景颜色和背景图像，改变padding将会影响盒子的大小

边框：包围内边距的部分称为border边框，可以设置颜色和样式

边界：包围边框的部分称为margin外边距，可以在同一个页面上两个不同元素之间增加透明空间，不可以设置颜色和任何装饰，可以呈现背景颜色和图像，但元素的背景颜色和图像不会呈现到外边距，改变margin不会影响盒子的大小，但过大有可能将盒子内容挤出盒子，注意相邻的两个块元素的上下margin会折叠后取较大的一个，内联元素的上下margin无效(img元素除外)