请无视此条外边距margin设置边框以外，盒子和盒子之间的距离margin: 10px;margin: 10px 20px;/* 上下各10px 左右各20px*/margin: 10px 20px 30px;/* 上10px 左右各20px 下30px*/margin: 10px 20px 30px 40px;/* 上10px 右各20px 下30px 左40px*/单方向margin-left: 20px;margin-top: 40px;margin-bottom: 50px;margin-right: 40px;清除默认的内外边距margin:0padding:0body默认有margin：8pxp默认有上下的marginul默认有margin和padding-left外边距问题水平布局的盒子，左右的margin正常，互不影响外边距折叠现象(2种)垂直布局的块级元素，上下的margin会合并 最终两者的距离为margin的最大值避免这种问题，只给其中一个盒子设置margin即可塌陷互相嵌套的块级元素，子元素的margin-top会作用在父元素上 ，导致父元素一起往下移动解决方法： 1：给父元素设置padding-top,父元素的高度根据需求要自减 2：给父元素设置overflow:hidden,子元素的margin-top不能去掉 3：设置浮动常见文档流排版规则：块级元素：从上往下，垂直布局，独占一行行内元素 或行内块元素 从左往右 水平布局 空间不够自动换行浮动float:浮动元素会脱离标准流，在标准流中不占位置浮动找浮动，下一个浮动元素会在上一个浮动元素【后面左右】浮动浮动元素有特殊的显示效果 1：一行可以显示多个 2：可以设置宽高 3：浮动元素不设置宽高，没有内容，宽高各为0