gpt4 book ai didi

css - IE 8 不透明度影响所有子元素

转载 作者:太空宇宙 更新时间:2023-11-04 15:20:43 25 4
gpt4 key购买 nike

我有一个要设置不透明度的 div。我有以下 CSS:

background: rgb(255, 255, 255); /* Fall-back for browsers that don't support rgba */
background: rgba(255, 255, 255, .7);
filter: alpha(opacity=70); /* IE 7 and Earlier */
/* Next 2 lines IE8 */
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);

在兼容的浏览器中工作正常,但在 IE 8 中,这也会使带有 div 的子元素透明。

我知道这个问题与 this one 密切相关但那里的答案对我不起作用。

有没有人有什么建议?

谢谢!

最佳答案

IE8 不支持 RGBa,MS 滤镜不透明度会影响元素及其子元素。

来自 http://css-tricks.com/rgba-browser-support/ 的建议修复

<!--[if IE]>

<style type="text/css">

.color-block {
background:transparent;
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#50990000,endColorstr=#50990000);
zoom: 1;
}

</style>

<![endif]-->

OR(使用条件类)

<!--[if IE 7]>    <html class="no-js ie7 oldie" lang="en"> <![endif]-->
<!--[if IE 8]> <html class="no-js ie8 oldie" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->

.ie8.your-selector {
background:transparent;
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#50990000,endColorstr=#50990000);
zoom: 1;
}

解决此问题的另一种方法是使用 1px x 1px 透明 png 重复作为元素的背景图像。

关于css - IE 8 不透明度影响所有子元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14616164/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com