一种是在css样式中用opacity属性来控制div的透明，这种方法会让div中的所有内容都变为半透明的效果，如下所示的例子：
<html>
<head>
<meta charset=”utf-8″/>
<style>
.aa{
width: 300px;
height: 300px;
background: red;
opacity: 0.5;
}
.bb{
width: 150px;
height: 150px;
margin:50px;
background: yellow;
}
</style>
</head>
<body>
<div class=”aa”>背景
<div class=”bb”>偶是内容</div>
</div>
</body>
</html>
运行效果如下图所示：
不管是文字还是背景都变成半透明的了。
第二种方法是，通过background-color或者background属性，将颜色值设置为带透明度的值：rgba(255,255,0,0.5)。 最后一个值即为设置透明度。如下例子所示：
<html>
<head>
<meta charset=”utf-8″/>
<style>
.aa{
width: 300px;
height: 300px;
/*background: red; */
background-color: rgba(255,0,0,0.5)
/*opacity: 0.5;*/
}
.bb{
width: 150px;
height: 150px;
margin:50px;
background: yellow;
}
</style>
</head>
<body>
<div class=”aa”>背景
<div class=”bb”>偶是内容</div>
</div>
</body>
</html>
运行效果如下所示：
只有背景被设置了不透明度。
希望偶的回答对你有所帮助，欢迎关注本头条号，更多技术分享都在这里
@ css选择器识别范围？
css选择器优先级核心：每个选择器本身有优先级，作用范围越具体优先级越高。
CSS优先级从高到低分别是：
1.在属性后面使用 !important 会覆盖页面内任何位置定义的元素样式。
2.作为style属性写在元素标签上的内联样式
3.id选择器
4.类选择器
5.伪类选择器
6.属性选择器
7.标签选择器
8.通配符选择器
9.浏览器选择器
当CSS样式的规则由多个选择器组成时，id选择器的权值为1000，class选择器为100，标签选择器为10，按权值求和的记过高低决定哪个优先。当两个css规则的权值相同时，谁更具体用谁，也就是权值高的选择器作用的越具体优先级越高。当两个选择器规则和权值都是一样，后面样式会覆盖前面的！
@ css颜色调多少好？
css的颜色调试成#ffffff，html的默认背景色是白色，字体的颜色默认是#000000；所以css的颜色调试成白色和黑色合适
![[05月]白发- 一篇令人动容的重庆市中考满分作文](https://1000zi.500zi.com/uploadfile/img/2024/05/27/21107902bf63cb77c07022e14d50d0f3.jpg)
