兼容ie67及标准浏览器的背景透明内容不透明css整理

今天打开W3Cfuns,看到一篇文章:背景透明内容不透明的css生成器(链接:http://www.w3cfuns.com/blog-4447-5397764.html),不觉欣喜若狂;曾记得以往多次遇到此种情况,都要建两个div,然后用opacity和filter解决,总感觉像是夏天贴膏药;

马上试用了一下,兼容性很好,于是想要存到硬盘中方便以后随时用,但是这是一个用js写的css生成器,不方便存放,无奈只能一点点分析css组成;

又百度了下,查到小虾对于该css的详细分析(链接:http://www.xiaoboy.com/detail/1341545064.html),小虾对该css背景透明的兼容做了具体解释,在此我不详细赘述;

以下是整理好的两个版本css(可直接用):

W3Cfuns版:

#content{
background:rgba(51,51,51,0.5);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#7f333333,endColorstr=#7f333333);
zoom:1;
}
:root #content{
filter:none\9;
}

备注:其中 rgb(51,51,51)、#333333  是背景色的十进制、十六进制表达;

小虾版:html:

<!--[if lt IE 9]>
<style>
#content{
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#77000000, endColorstr=#77000000);
}
</style>
<![endif]-->

css:

#content{
background:rgba(0,0,0,0.5);
}

《兼容ie67及标准浏览器的背景透明内容不透明css整理》有2个想法

发表评论

电子邮件地址不会被公开。 必填项已用*标注