我刚刚开始处理HTML和CSS.我想堆叠不同的div(见图).
黑色的div代表容器.红色div a标题和蓝色div a标题是一个圆心,圆心位于红色div的底部边缘.
解决方案最终也应该是响应性的.我在这里要考虑什么?
.container {
height: 300px;
width: 600px;
background-color: black;
text-align: center;
}
.header {
height: 40%;
width: 100%;
background-color: red;
}
.circle {
background-color: blue;
height: 100px;
width: 100px;
border-radius: 50%;
display: inline-flex;
}
<div class="container">
<div class="header">
<div class="circle"></div>
</div>
</div>