前言：
margin作为一个在平常工作中高频出现的属性，其合并规则和负值的使用却总是让人头大，本文就margin的负值和重叠进行梳理，如有错误，欢迎指正（反正我是菜鸡，手动滑稽）
1.display对margin的影响
当元素的display属性不同时，margin在元素上的表现形式也不同
【1】display:block 四个方向的margin均有效
【2】display:inline 上下方向的margin无效
【3】display:inline-block
由于vertical-align属性的默认值为baseline(该元素相对于所在行的基线垂直对齐)，因此在视觉上display:inline-block无效，设置vertical-align为其他值时，会有效果。
2.重叠
margin负值的重叠也和display属性有关
【1】两个block元素重叠时，后面的元素可以覆盖前面元素的背景，但是无法覆盖其内容
【2】当两个元素都是inline或inline-block的元素时，后面的元素会覆盖前面元素的背景和内容
【3】当inline（inline-block）元素与block元素重叠时，inline（inline-block）元素的背景会覆盖block的背景，但是元素内容会以后面的元素为准。
3.浮动
【1】当block元素与浮动元素重叠时，其边框和背景在浮动元素下显示，内容在浮动元素之上显示
【2】当inline或inline-block元素和浮动元素重叠时，其边框、背景和内容都在浮动元素之上显示
4.定位
【1】定位元素（position不为默认值）会覆盖其他元素的背景和内容
【2】将relative应用于inline元素上时，由于无法改变其行内元素本质，上下margin仍存在问题