背景透明内容不透明

最新推荐文章于 2024-09-15 22:31:42 发布

weixin_34289744

最新推荐文章于 2024-09-15 22:31:42 发布

阅读量76

点赞数

文章标签： python

原文链接：https://my.oschina.net/yangff/blog/99886

版权

2019独角兽企业重金招聘Python工程师标准>>>

有时候我们希望某块内容有一个透明的背景色,通常情况下我们会设置它的透明度,例如

<head>
    <title>背景透明内容不透明</title>
   <style type="text/css">
   .item{background:rgba(0,0,0,0.5)!important;filter:alpha(opacity=50);background:#000;width:200px;height:200px;border:1px #ccc solid;}
       .item .thumb,.item .caption{color:#000;text-align:center;width:100px;background:#fff;}
   </style>
</head>
<body>
    <div class="item">
       <div class="thumb">测试文字111111</div>
       <div class="caption">测试文字222222</div>
    </div>
</body>

此时firefox,chorme等浏览器的表现符合我们的期望,但是IE又一次让我们失望了,它连同其中的内容都把透明度变为了50%,而这显然不是想要的结果,那么怎么解决呢?