问题描述
做半透明黑色遮罩时，使用 css filter 做 IE 下的半透明背景兼容，一般这样写：
.semi-trans { background: rgba(0, 0, 0, .7); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#B2000000, endColorstr=#B2000000);}
然而，IE9 下这种滤镜 + CSS3 的样式会显示成全黑的背景。
减法解决
所谓减法，就是 CSS HACK 或者条件注释类来针对 IE9 覆盖之前的样式。
但是， filter 似乎是覆盖不了的，其机制似乎比较复杂，反正以下这几种都没有效果：
filter:;
filter:none;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#FF000000, endColorstr=#FF000000);
此外，由于 IE9 既单独支持这种 gradient filter ，又支持单独的 CSS3 样式，所以用减法将 CSS3 的属性去掉即可。
CSS3 HACK 覆盖法
:root .semi-trans {background:none\9\0;}
/* 针对 IE9 10 的 hack */
条件注释类覆盖法
- 将 HTML 文档头部的<html>改成类似这种形式：
<!--[if lt IE 7 ]>
<html lang="zh"> <![endif]-->
<!--[if IE 7 ]>
<html lang="zh"> <![endif]-->
<!--[if IE 8 ]>
<html lang="zh"> <![endif]-->
<!--[if IE 9 ]>
<html lang="zh"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!-->
<!--<![endif]--> - 然后在相应的 CSS 后面这样覆盖：
.ie9 .semi-trans {background:none;}
- 本文固定链接: http://madong.net.cn/index.php/2016/11/583/
- 转载请注明: 管理员 于 小东 发表
这个作者貌似有点懒，什么都没有留下。