美文网首页
关于ie8下的opacity问题

关于ie8下的opacity问题

作者: tonarinototoro | 来源:发表于2018-08-10 09:48 被阅读0次

正常情况下,在ie8下设置opacity是无效的,ie8下的兼容设置是:

opacity:.5; filter:alpha(opacity=50);

一般情况下是没有问题的,像jpg,gif之类的,但是当图片是png格式且背景透明,边界是不均匀的半透明图片(比如三角形)时,filter设置会使图片出现杂边,(像正方形这种边界整齐的图片不会出现这个问题)如图:

所以比较这两张图片的边界差异:

从网上搜索一些解决方法尝试效果:

filter:progid:DXImageTransform.Microsoft.AlphaImageLoader (src="******.png", enabled=true, sizingMethod=scale);  这种方法可以去除杂边,但也会使opacity失效,想要设置图片透明过度是无效的。相当于没有设置opacity,总结来说相当于是无效的,因为ie8本身是支持png24的图片显示的。

filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);同filter:alpha(opacity=50);效果一样,杂边依然存在。

-ms-filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);  这种设置貌似是无效的。

所以个人认为,ie8下仅用css无法设置透明背景图片的opacity过度效果,可以通过visibility或display来做简单的隐藏显示效果。

通过js配合可能能实现吧,后续考虑一下。

相关文章

  • 关于ie8下的opacity问题

    正常情况下,在ie8下设置opacity是无效的,ie8下的兼容设置是: opacity:.5; filter:a...

  • 解决IE8下opacity属性失效问题

    由于opacity属性存在兼容性问题,所以在IE8下,用opacity来设置元素的透明度,会失效,从而导致页面的样...

  • 雪碧图/css

    opacity:0.5;filter:alpha(opacity=100); /* For IE8 and ear...

  • css 透明框中的文本

    透明的关键字:opacity。 (IE8以及更早版本要用filter,并设置“alpha(opacity=60)”...

  • opacity

    Opacity: Css3 opacity透明度设置 所有主流浏览器都支持opacity属性。. IE8和早期版本...

  • 前端06day

    opacity属性在IE8及以下的浏览器中不支持IE8及以下的浏览器需要使用如下属性代替alpha(opacity...

  • 07day-背景雪碧图

    opacity属性在IE8及以下的浏览器中不支持IE8及以下的浏览器需要使用如下属性代替alpha(opacity...

  • 实现新手引导效果笔记

    隐藏按钮文字的小技巧## opacity 属性## IE8以下浏览器都不支持 opacity css样式,可以使用...

  • 兼容

    1、opacity属性在IE8及以下的浏览器不支持,可用以下方式代替 filter: alpha(opacity=...

  • IE8下GetJson请求只能发送一次的解决办法

    1.问题描述 做项目的过程中,在IE8下 使用getJson请求数据,多次测试发现由于IE8的锅,在IE8下只会真...

网友评论

      本文标题:关于ie8下的opacity问题

      本文链接:https://www.haomeiwen.com/subject/dkpcbftx.html