本文主要是介绍关于CSS中opacity改变透明度问题，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
我们如果在写背景样式时直接使用opacity，会造成背景和其文字全部透明，例如如下代码：
.div1 {width: 100px;height: 60px;background-color: #a4f3c0;opacity: 0.3;font-size: 30px;
}<div class="div1">hello
</div>效果图如下
可以看出，直接使用opacity会使文字和背景全部改变透明度。
解决方案：背景改变透明度使用rgba(要注意后面的颜色要使用三原色表示了)，这样就不会影响文字了。代码如下:
.div2 {width: 100px;height: 60px;background: rgba(164, 243, 192, 0.3);font-size: 30px;
}<div class="div2">hello
</div>效果图如下
这篇关于关于CSS中opacity改变透明度问题的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
