CSS 为实现重叠效果，将 margin-top 设为负值时，div 背景被 img 图片遮挡

效果：

通过将 div margin-top 设为负值实现 div 部分重叠在 img 图片上。

CSS 为实现重叠效果，将 margin-top 设为负值时，div 背景被 img 图片遮挡

效果：

由效果图可知，存在 div 的绿色背景被遮挡问题。

通过将 div 设置为 position: relative; 解决实现重叠效果时 div 背景被遮挡问题。

CSS 为实现重叠效果，将 margin-top 设为负值时，div 背景被 img 图片遮挡

效果：

CSS 为实现重叠效果，将 margin-top 设为负值时，div 背景被 img 图片遮挡

上述代码中，同时设置了父容器 body 的宽度和 div 的 display: inline-block;。

效果：

原文地址：https://www.cnblogs.com/yuzhihui/p/17246928.html