在开发中遇到的问题,需要背景透明,还要兼容到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,如图所示:
© 著作权归作者所有
举报
发表评论
0/200