一、margin描述【概念】盒模型中的外边距，即围绕元素边框的空白区域。盒子模型请参考https://segmentfault.com/a/11..【属性值】Topmarginmargin-top:10pxRightmarginmargin-right:10pxBottommarginmargin-bottom:10pxLeftmarginmargin-left:10px当然也可以简写为margin:toprightbottomleftRight,bottom,left即顺时针）指定三个值margin:10px20px30px;分别指定top10px，right20px，bottom30px，即最后左边间距默认为0；指定两个值margin：10px20px；分别指定上下10px，左右20px，指定一个值margin:10px；指定10px上、下、左、右。【属性单位】接受任意长度单位（px/em/rem等），auto，百分比。2、使用margin:0auto实现块级元素水平居中3、属性单位为%，水平方向使用%，距离为父元素宽度的百分比。如下图所示，父元素的宽度为500px。子元素的margin-left设置为10%。渲染后，垂直方向50px使用%。距离不是父元素高度的百分比，而是父元素宽度的百分比。如下图所示，父元素的宽度为500px。子元素的margin-top设置为10%，渲染后为50px。定义与其他元素的最小间距。规则：如果两个margin都是正数，取最大值；如果边距之一为正，一个为负，则取两者之和，如果边距为负，则取最小值。margin，靠近父元素的顶部，如果父元素上设置了margin，则合并，合并后的值为两者中较大的值。4、子元素穿透父元素如下图所示。在父元素之上，会造成穿透。貌似父元素是margin-top的方案：父元素设置padding-top:1px或border:1pxsolidtransparent组成新的BFC，父元素或子元素设置float,postion,overflow:hidden(我一般比较喜欢设置overflow:hidden)如下图，设置父元素的上述属性，避免穿透。的子元素。原因：因为边距折叠只发生在块级元素上；浮动元素与正常流分离，与其他元素不在同一流中。b.inline-block或floating元素形成一个新的BFC，与子元素不在同一个BFC中，所以不会重叠；
