html实现背景颜色透明 文字效果不透明

html实现背景颜色透明，文字效果不透明

通过伪元素的方式添加遮罩层（给背景颜色，层级，透明度，定位）即可，弹窗原理。

<li class="contentLi"><p class="content-title">{{itemTitles}}</p><div class="bidDataAndIcon"><div class="leftData">评标时间：<span>14:30:00</span>&nbsp;-&nbsp;<span>18:30:00</span></div><div class="isBidAssessment">正在评标 <img src="./img/title-time1.png" alt=""></div></div><div class="peopleState"><div><img src="./img/user-img.png" alt=""><span>张三</span><i class="leave">离开</i></div><div><img src="./img/user-img.png" alt=""><span>张三</span><i class="enter">进入</i></div><div><img src="./img/user-img.png" alt=""><span>张三</span><i class="leave">离开</i></div></div></li>.contentLi {border-radius: 0px 45px 0px 45px;padding: 49px 40px 30px 39px;position: relative;z-index: 2;&::before {content: '';display: block;position: absolute;width: 8px;height: 174px;background: rgba(255, 114, 55, 0.39);left: 0;top: 0;}&::after {//添加一个遮罩层 content: '';width: 100%;height: 100%;background: rgba(37,67,118,8);opacity: .8;top: 0;left: 0;position: absolute;z-index: -1;}