盒子模型组成部分

border边框
border-width定义边框粗细，单位是px
border-style边框的样式
border-color边框颜色
border简写 border：1px solid red；（没顺序）
border-collapse：collapse；(合并相邻的边框）
会影响盒子实际大小

content内容

padding内边距
padding-left（左内边距）
padding-right(右内边距）
padding-top（上内边距）
padding-bottom（下内边距）
padding：5px（一个值，代表上下左右都有五像素内边距）
padding：5px 10px（2个值，代表上下内边距是5像素 左右内边距是10像素）
padding：5px 10px 20px；（3个值，代表上内边距5像素 左右内边距10像素 下内边距20像素）
padding：5px 10px 20px 30px；（4个值，上是5像素 右10像素 下20像素 左30像素 顺时针）
会影响盒子实际大小，如果盒子本身没有指定width/height属性，则此时padding不会撑开盒子大小
ps：文字字数不一样多时可只给padding

margin外边距
margin-left （左外边距）
margin-right （右外边距）
margin-top （上外边距）
margin-bottom （下外边距）
margin简写方式代表的意义与padding完全一致

相邻块元素垂直外边距合并：取较大者，尽量只给一个盒子加margin值

对于两个嵌套关系（父子关系）的块元素，父元素有上边距同时子元素也有上外边距，此时父元素会塌陷较大的外边距值：①可以为父元素定义上边框 ②可以为父元素定义上内边距 ③可以为父元素添加overflow：hidden

块级盒子水平居中：
1.盒子必须指定宽度
2.盒子左右的外边距都设置为auto（margin：0 auto；）
ps：行内元素或者行内块元素水平居中给其父元素添加text-align：center即可

清除内外边距：
* {
padding:0;
margin:0;
}
ps:行内元素尽量只设置左右内外边距，不要设置上下内外边距，转换为块级和行内块就可以了