如题，解决背景透明，文字不透明的办法。
背景透明，文字不透明又分为两种：
1、背景颜色透明，文字不透明
2、背景图片透明，文字不透明
一、设置opacity ——背景图片/颜色透明，文字也透明
<style>
div{
width: 180px;
height: 120px;
background: red;
font-size: 24px;
opacity: 0.3;
}
</style>
</head>
<body>
<div id="box1">
文字文字
</div>
二、设置rgba() ——背景颜色透明，文字不透明
<style>
div{
width: 180px;
height: 120px;
font-size: 24px;
background-color: rgba(0,0,0,0.3);
}
</style>
</head>
<body>
<div id="box1">
文字文字
</div>
三、设置伪类 ——背景图透明，文字不透明
<style>
div{
width: 180px;
height: 120px;
font-size: 24px;
}
div:before{
width: 180px;
height: 120px;
position: absolute;
top: 0;
left: 0;
}
</style>
</head>
<body>
<div id="box1">
文字文字
</div>
四、父div设置背景，子div设置透明度 ——背景透明，文字不透明
<style>
#box1{
width: 180px;
height: 120px;
background-image: url("img/littleboy.jpg");
background-size: cover;
position: relative;
}
#box2{
position: absolute;
top: 0;
left: 0;
width: 180px;
height: 120px;
background: rgba(0,0,0,0.5);
}
</style>
</head>
<body>
<div id="box1">
<div id="box2">文字文字</div>
</div>
