什么是盒模型

盒模型是一种在网页布局设计中影响网页元素之间的位置的模型。
盒模型的组成有content（内容），padding（内边距），border（边框），margin（外边距）。

应用：
padding：通常有padding-left，padding-right，padding-top，padding-bottom。也可以直接padding，给padding一个值时代表四周内边距一样；给padding两个值时第一个值代表上下内边距，第二个值代表左右内边距；给padding三个值时，第一个值代表上内边距，第二个值代表左右内边距，第三个值代表下内边距；给padding四个值时，第一个值代表上内边距，第二个值代表右内边距，第三个值代表下内边距，第四个值代表左内边距。

border：和padding相似也有上下左右四个值。border缩写格式和padding同理。此外border还有border-width，border-style，border-color三个属性比较常用。

margin：和padding相似也有上下左右四个值。书写格式与padding同理。

注：
1.在给盒模型添加padding值时，应当相应的减去由于padding带来的扩大，也就是现在的宽等于原来的宽减去设置的padding-left值再减去padding-right。现在的高等于原来的高减去设置的padding-top值再减去padding-bottom。

2.在上下排列的盒模型里，给上面的设置margin-bottom属性，给下面的设置margin-top属性，可能会导致不能正常显示，只能显示一个值，且以较大的值显示。