时间戳

首页 > 解决方案 > 如何将父背景重叠到子背景

css - 如何将父背景重叠到子背景

问题描述

我有两个 div，一个父母和另一个孩子都有自己的背景颜色。子背景颜色与父背景颜色重叠，但我希望父背景与子背景重叠。请关注 JS-Fiddle

<div id="p" >
    <div id="c"/>
</div>

这是小提琴链接 http://jsfiddle.net/26husf4v/2/

红色（父背景）应位于蓝色（子）背景之上，而超出的红色仍然可见

标签： css

解决方案

实际上，这是可以实现的z-index，但是为了：

而超出的蓝色仍然可见

（如果我没听错的话！）您应该使您的子元素大于父元素，而不是您之前在代码段中所做的。

所以你的最终代码应该是这样的：

#p {
  width: 200px;
  height: 200px;
  background: red;
}

#c {
  position: relative;
  z-index: -1;
  width: 300px;
  height: 300px;
  background: blue;
}
<div id="p">
  <div id="c"></div>
</div>

推荐阅读