背景透明度处理 兼容IE

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Document</title>
 6     <style type="text/css">
 7         /*CSS*/
 8         body{
 9             width: 100%;
10             background:url(http://c.hiphotos.baidu.com/image/pic/item/9358d109b3de9c82bb3ff8456581800a18d843a5.jpg) no-repeat;
11         }
12         .con{
13             width: 600px;
14             height: 300px;
15             padding:20px 0;
16           background-color: rgba(0,0,0,0.6);/* IE9、标准浏览器、IE6和部分IE7内核的浏览器(如QQ浏览器)会读懂 */
17         }
18         .con p{
19           color: #FFFFFF;
20         }
21 
22         /*针对IE6、7、8浏览器,我们可以采用fiter:Alpha,针对标准浏览器我们采用rgba,那么问题来了,IE9浏览器2个属性都支持,一起使用会重复降低不透明度...*/
23 
24         @media screen\,screen9 {/* 只支持IE6、7、8 */
25           .con{
26             background-color:#000000;
27             filter:Alpha(opacity=60);
28             position:static; /* IE6、7、8只能设置position:static(默认属性) ,否则会导致子元素继承Alpha值 */
29             *zoom:1; /* 激活IE6、7的haslayout属性,让它读懂Alpha */
30           }
31           .con p{
32             position: relative;/* 设置子元素为相对定位,可让子元素不继承Alpha值 */
33           }
34         }
35 
36         /*HTML代码*/
37     </style>
38 </head>
39 
40 <body>
41 <div class="waps">
42   <div class="con">
43     <p>CSS实现背景透明,文字不透明(各浏览器兼容)CSS实现背景透明
44     </p>
45   </div>
46 </div>
47 </body>
48 </html>
49 原文链接:https://www.cnblogs.com/PeunZhang/p/4089894.html

还有分享一个技术群,474471759,跟随里面的大佬一起成长,进群之后里面的JimY就是我。

如果我的博客解决了你的问题,那请你给个关注吧!
原文地址:https://www.cnblogs.com/DreamSeeker/p/7879723.html