为IE8设置背景透明

在开发中遇到的问题，需要背景透明，还要兼容到IE8，特此记录一下~~~

需求

给id为test的div设置白色透明度10%

<div id="test"></div>

步骤

（1）给当前元素设置透明度，需要给这个元素加个父元素，再加个兄弟元素；

<div id="test-father">
    <div id="test-brother"></div>
    <div id="test"></div>
</div>

（2）兄弟元素设置如下代码：

#test-brother {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #fff;
    filter: alpha(opacity=10);
    background-color: rgba(255,255,255,.1);
}

（3）父元素设置如下代码：

#test-father {
   position: relative;
}

（4）避免IE9识别filter：

:root #test-brother{
   filter: alpha(opacity=100);
}

以上4步可以实现设置透明度兼容到IE8，如图所示：