组成 margin 外边距 border 边框 padding 内边距 content 内容 content 盒子默认大小为内容大小 border( top bottom left rignt ) border-color border-width px border-style none solid dashed dotted 复合写法无顺序 border-collapse collapse 相邻单元格边框合并 border-radius 半径 影响盒子实际大小 padding( top bottom left rignt ) 复合写法 x1上下左右 x1上下 x2左右 x1上 x2左右 x3下 x1上 x2右 x3下 x4左 影响盒子实际大小 若不指定盒子大小则盒子继承父元素大小此时padding不会撑开盒子大小 margin( top bottom left rignt ) 复合写法同padding 外边距合并 当上下两个块元素合并时若上面元素有margin-bottom 下面元素有margin-top 则两者之间的垂直间距为两者 之中较大的 解决方案 尽量设置一个margin 外边距塌陷 对于两个嵌套关系的块元素 父子元素都有margin-top 此时父元素会塌陷较大的外边距值 解决方案 父元素添加 上边框 上内边距 overflow: hidden 清除内外边距 * { padding: 0; margin: 0; } 水平居中 块级盒子(盒子需指定宽度) margin: 0 auto; 行内元素或行内块元素 父元素添加 text-decoration: center;