标题可能不是很专业，只要你有一点前端基础的应该能看懂意思，昨天没休息好，今天写项目有点飘，总是写了尾巴忘了头，年轻少熬夜*-*
如标题今天记录三个Css属性
opacity rgb rgba
下面来讲解一下久伴遇到的坑，由于久伴是前端小白，项目经验不多，在写一个demo的时候遇到一个问题，如图所示
父div透明了，但是父div中的子div也继承了opacity透明属性，这可不是久伴要的效果
解决方案
父div使用rgba（）Css属性即可解决这个问题，因为rgba（）属性用在父div上面不会被子div继承
opacity rab rgba属性解释
1,opacity设置颜色透明度
2,rgb（，，，）设置颜色r代表red，g代表green，b代表blue（取值在0-255之间）
3,rgba（，，，，）设置颜色r代表red，g代表green，b代表blue a代表opacity设置背景透明度（取值在0-1之间）
其实用opacity也可以设置背景透明文字不透明，这个需要使用定位（如果用定位请考虑好大局，不然代码多了你很难受的）
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
*{
margin: 0px;
padding: 0px;
}
body{
background: red;
}
.diva{
width: 200px;
height: 200px;
background: #ffffff;
opacity: 0.5;
}
.divb{
width: 200px;
height: 200px;
position: absolute;
top: 0;
left: 0;
text-align: center;
line-height: 200px;
}
</style>
</head>
<body>
<div class="diva">
</div>
<div class="divb">
我是文字
</div>
</body>
</html>
使用场景
opacity可用于图片遮罩，rgba用于背景透明文字不透明
加群入久伴博客官方微信群
加入久伴官方微信群有啥优势？
1.文章内部资源由于时间久远可能失效，加群,群内可以第一时间反馈
2.网站中教程不一定适用任何人，加群可以第一时间咨询并解决您得疑惑
3.你游荡于互联网，也需要群体，加群一起互动交流，畅所欲言
扫描下方二维码即可加入交流讨论
声明：本站所有文章，如无特殊说明或标注，均为本站原创发布。任何个人或组织，在未征得本站同意时，禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益，可联系我们进行处理。
不错的分享，谢谢