1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 2 ????????"http://www.w3.org/TR/html4/loose.dtd"> 3 <html> 4 <head> 5 ????<title></title> 6 ????<style type="text/css"> 7 ????????.div1{ 8 ????????????width: 150px; 9 ????????????height: 150px;10 ????????????background-color: #000001;11 ????????????text-align: center;12 ????????????/*透明度*/13 ????????????opacity: 0.5;14 15 ????????}16 ????????span{17 ????????????color: red;18 ????????????font-size: 18px;19 ????????????padding-top: 60px;20 ????????}21 ????</style>22 </head>23 <body>24 <div class="div1">25 ????<span>不改变文字的透明度</span>26 </div>27 </body>28 </html>使用opacity改变背景的透明度时，背景上的文字的透明度也会发生改变。为了使文字的颜色不发生改变，我们使用background-color: rgba();
background-color: rgba(a,b,c,a);三个参数依次为（R G B 透明度）的参数
1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 2 ????????"http://www.w3.org/TR/html4/loose.dtd"> 3 <html> 4 <head> 5 ????<title></title> 6 ????<style type="text/css"> 7 ????????.div1{ 8 ????????????width: 150px; 9 ????????????height: 150px;10 ????????????text-align: center;11 ????????????background-color: rgba(0,0,1,0.5);12 13 ????????}14 ????????span{15 ????????????color: red;16 ????????????font-size: 18px;17 ????????????padding-top: 60px;18 ????????}19 ????</style>20 </head>21 <body>22 <div class="div1">23 ????<span>不改变文字的透明度</span>24 </div>25 </body>26 </html>html中如何使得改变背景的透明度时，背景上的文字透明度不被改变
原文地址：http://www.cnblogs.com/ztt0918/p/7954496.html