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;
	}