css设置背景透明的方法：首先在【】标签创建【】标签和添加类；然后在【】标签里设置rgba类的高和背景透明度的样式【（rgba(R,G,B,A)）】。
本教程操作环境：windows10系统、css3版，DELL G3电脑，该方法适用于所有品牌电脑。
css设置背景透明的方法：
1、创建一个html文件。如图
立即学习“前端免费学习笔记（深入）”；
2、在html文件找到一个标签，在这个标签里创建一个
标签并添加一个类，在这把这个类设置为：rgba。 如图
标签后面创建一个<code></code>，在标签里设置rgba类的高和背景透明度的样式<code>（rgba(R,G,B,A)）。透明度参数，取值在0~1之间，不可为负值，透明度参数越小透明度越高。如图</p>
<p>代码：</p>
<div class="code" style="position:relative;padding:0px;margin:0px">
<pre class="brush:php;toolbar:false"><style type="text/css">.rgba{background-color: rgba(0,0,0,0.5);height: 200px;}</style></pre>
<div class="contentsignin"></div>
</div>
<p><noscript><img decoding="async" src="https://cdn.chuangxiangniao.com/www/2025/12/1614587283492815.png" title="1614587283492815.png" alt="f9766d5704ee607e84f1f60aa266033.png" /></noscript><img decoding="async" class="j-lazy" src="https://www.chuangxiangniao.com/wp-content/themes/justnews/themer/assets/images/lazy.png" data-original="https://cdn.chuangxiangniao.com/www/2025/12/1614587283492815.png" title="1614587283492815.png" alt="f9766d5704ee607e84f1f60aa266033.png" /></p>
<p>4、保存后使用浏览器查看。可以看到当透明度为由0.1修改为1时div背景由灰色变为了黑色。如图：</p>
<p><noscript><img decoding="async" src="https://cdn.chuangxiangniao.com/www/2025/12/1614587288571362.png" title="1614587288571362.png" alt="a8442ac80e35285b87ac6f28ea2c9be.png" /></noscript><img decoding="async" class="j-lazy" src="https://www.chuangxiangniao.com/wp-content/themes/justnews/themer/assets/images/lazy.png" data-original="https://cdn.chuangxiangniao.com/www/2025/12/1614587288571362.png" title="1614587288571362.png" alt="a8442ac80e35285b87ac6f28ea2c9be.png" /></p>
<p><noscript><img decoding="async" src="https://cdn.chuangxiangniao.com/www/2025/12/1614587295311922.png" title="1614587295311922.png" alt="4af9d3edb92148f27a2c5b403f61302.png" /></noscript><img decoding="async" class="j-lazy" src="https://www.chuangxiangniao.com/wp-content/themes/justnews/themer/assets/images/lazy.png" data-original="https://cdn.chuangxiangniao.com/www/2025/12/1614587295311922.png" title="1614587295311922.png" alt="4af9d3edb92148f27a2c5b403f61302.png" /></p>
<p><noscript><img decoding="async" src="https://cdn.chuangxiangniao.com/www/2025/12/1614587301589695.png" title="1614587301589695.png" alt="07119a98da64def611f3c2d1713945d.png" /></noscript><img decoding="async" class="j-lazy" src="https://www.chuangxiangniao.com/wp-content/themes/justnews/themer/assets/images/lazy.png" data-original="https://cdn.chuangxiangniao.com/www/2025/12/1614587301589695.png" title="1614587301589695.png" alt="07119a98da64def611f3c2d1713945d.png" /></p>
<blockquote>
<p><strong>相关教程推荐：<a href="http://www.php.cn/course/list/12.html" target="_blank"><strong>CSS视频教程
代码：
<div class="rgba"></div>
3、为div添加样式。在
以上就是css如何设置背景透明的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1618180.html
微信扫一扫 
支付宝扫一扫 
