CSS重叠多个div

Question

您好！我想用圆圈div完成这个。我知道如何用1 div中的绝对和相对来完成定位，但是如果我想用两个div来制作这个并使圆圈重叠这两个div是否有任何简单/智能的方式进入CSS？

Answer 1

希望有所帮助

＆＃13;

＆＃13;

body {
  margin: 0px;
}

.top,
.bottom {
  width: 100%;
  height: 100px;
}

.top {
  background: red;
}

.bottom {
  background: black;
}

.circle {
  background: green;
  height: 100px;
  width: 100px;
  border-radius: 50%;
  position: absolute;
  top: 50px;
  left: 50vh;
}

＆＃13;

<div class="top"></div>
<div class="bottom"></div>
<div class="circle"></div>

＆＃13;

＆＃13;

＆＃13;