有许多可行的解决方案可以在 IE 中正确显示透明的 png,但如果图像位于旋转的容器中,所有这些解决方案都将不起作用。
我试过了
img{
background: transparent;
-ms-filter: “progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)”;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);
zoom: 1;
}
解决 IE 的透明 png 错误,但它不起作用。
我在 . 创建了一个展示柜。 http://jsfiddle.net/s__a/Hmyc2/
请确保您使用 Microsoft Internet Explorer 7 访问此网站,IE8 没有实现旋转。 任何人都可以帮助在 IE7/IE8 中正确显示旋转的图像吗?
最好的问候。
最佳答案
仅找到坚实的背景解决方案
我花了一些时间才把它拼凑起来。我的第一个线索是 this site ,这产生了以下代码更改。 实际上,我现在才注意到,我下面的代码与您在问题中所说无效的代码相同,但对我有效... 重新检查我的 fiddle ,看看它现在是否适合你。请注意,在 this fiddle it worked for IE7 but not IE8 (img
不旋转)。
.test-1{
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#FFFFFFFF,endColorstr=#FFFFFFFF)";/* IE 8 */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#FFFFFFFF,endColorstr=#FFFFFFFF); /* IE 6 & 7 */
clip:rect(0px 276px 267px 0px); /* top,right,bottom,left */
}
所以多一点挖掘和一个Stack Overflow answer帮助制作 a fiddle work for IE8 too ! IE8 的最终修复是使用 Matrix
过滤器转换的元素需要添加 z-index
以更正它不旋转子 的错误>img
元素。
但是,这个“修复”显然仍然只是部分修复。 The issue on the rotated element目前对于背景本身的任何透明度都保持不变,因为如果渐变的 alpha 值设置为透明 #00FFFFFF
那么它只对非旋转元素起作用。
关于css - IE7 和 IE8 中旋转透明 png 周围的黑边,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11386177/