页面布局margin越界和float引起的影响常用的css套路

话不多说，直接上

1.防止子元素的margin越界

.parent:before {
content: '  ';
display: table;
}
其他办法还有:
父元素设置padding-top；
父元素设置边框;
父元素设置overflow:hidden;等

2.清除子元素的浮动对父元素及后续元素造成的影响

.parent:after {
content: '  ';
display: table;
clear: both;
}