代码示例 <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>半透明背景示例</title> <style type="text/css"> #content { background:rgba(0, 0, 0, 0.3); width:100px; height:100px; } #background { background:red; width:150px; height:150px; } #test { background:rgba(0, 0, 0, 0.3); width:100px; height:100px; } </style> </head> <body> <div id="background"> <div id="content"></div> </div> <div id="test"></div> </body></html>
浏览器中显示如下图：
关于rgba() r表示红色 ，g表示绿色，b表示蓝色， a是透明度a的值在0-1之间，1表示不透明，0表示全透明。rgb的值用十进制表示 element { color: rgba(255, 0, 0, 0.5) }