类似实现这种效果
正确写法:
HTML5
<div class="title">
<h6>注销账号请确认</h6>
<div class="yellow"></div>
</div>
css
.title{
position: relative;
height: 2.41rem;
margin-bottom: 1.625rem;
}
h6{
font-size:1.063rem;
font-family:PingFangSC-Semibold,PingFang SC;
font-weight:600;
color:rgba(0,0,0,1);
text-indent: 0.188rem;
margin-top: 4%;
z-index: 99;
position: absolute;
top: 0;
left: 0;
}
.yellow{
width:7.969rem;
height:0.5rem;
background:rgba(237,228,123,1);
position: absolute;
bottom: 0px;
left: 0px;
z-index: 2;
}
利用定位和z-index两者结合得以实现。
注:若要定位div中的两个元素都要定位。