CSS透明没有继承 css opacity is not inherited in internet explorer

今儿遇到一个问题源于同事写的一个页面，发现父级明明 opacity:0 了，但子级还显示，原来是 IE9+ 的一个 BUG；影响版本： IE9/IE10/IE11

解决方案，请参考：http://makandracards.com/makandra/21779-css-opacity-is-not-inherited-in-internet-explorer

Elements will not inherit their parent’s opacity in IE for no good reason. This can lead to unexpected behaviour when you want to fade/hide an element and all its children.

To fix it, give the element defining the opacity a non-static positioning. For example:

.foo {
  opacity: 0.2;
  position: relative; // for IE
}

While the linked article describes this problem for IE9 and below, I have encountered the same issue in IE10 and IE11.

Just go away, Internet Explorer!