IE中的alpha透明度解决方案

发布于 2024-08-14 11:33:59 字数 115 浏览 15 评论 0原文

我正在构建一个包含大量具有透明背景的 png-24 文件的网站。在 IE 6 中，它们显然无法正确显示，因此我需要某种可靠、良好的解决方案来解决 IE 中的 PNG 问题，并且需要很少的工作并且可靠。有什么好主意吗？

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

浮世清欢 2024-08-21 11:33:59

对于 IE6 透明度，我遵循个人流程：

1.如果只有一两个 PNG 图像（如徽标或普通图像），我只需使用过滤器：

#selector {background:none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='test.png', sizingMethod='crop');}

< em>问题：如果应用于链接，它将不再可点击。可能适用于 h1#logo 并使 a 透明。

2. 如果我有很多 24 位 PNG 文件，或特殊用例（重复背景等），我会使用 DD_belatedPNG

对于 IE7 + IE8 很重要： 您不能对 filter:alpha （用于IE 中元素的整体 opacity ，并且 jQuery 也使用它来设置 24 位透明 PNG 图像的 opacity) 属性。它将其更改为看起来像 8 位透明度，所有非 100% 不透明或透明的内容都呈现黑色背景。

For IE6 transparency I follow a personal flow:

1. If there is just one or two PNG images (like a logo, or a normal image) I just use filter:

#selector {background:none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='test.png', sizingMethod='crop');}

Problems: If applied to a link, it will no longer be clickable. Possibly apply to the h1#logo and have the a be transparent.

2. If I have a lot of 24-bit PNG files, or special use cases (repeating background, etc), I use DD_belatedPNG

IMPORTANT FOR IE7 + IE8: You cannot animate or combine the filter:alpha (which is used for overall opacity on an element in IE and also used by jQuery to set opacity) property with 24-bit transparent PNG images. It changes it to look like 8-bit transparency, with everything that is not 100% opaque or transparent taking on a black background.

回复收藏 0 原文

沫离伤花 2024-08-21 11:33:59

以下是针对 ie6 的一些不错的 png 修复：

http://labs.unitinteractive.com/unitpngfix.php< /a>

http://www.twinhelix.com/css/iepngfix/

回复收藏 0 原文

口干舌燥 2024-08-21 11:33:59

网上有很多 IE PNG 修复程序，基本上都使用相同的技术。较旧的 Internet Explorer 不直接支持 PNG 中的 Alpha，但它们都有一个过滤器可以支持 Alpha。因此，将以下代码编写为对象 css 的一部分，会将 src 中的图像设置为元素的背景：

filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='image.png');

这样，您就可以轻松地在 Internet Explorer 中显示透明度。然而，获取 png 修复脚本之一（在 JavaScript 中）并将其包含到页面的条件注释中要容易得多。然后脚本将使您的所有图像自动工作。

There are a lot IE PNG fixes on the net, which basically all work with the same technique. The older Internet Explorers do not support alpha in PNGs directly, but they all have a filter that does so. So writing the following code as part of a css of an object puts the image in the src to the background of the element:

filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='image.png');

That way, you can easily display transparency in the Internet Explorer. However it's a lot easier to just get one of the png fix scripts (in JavaScript) and include it to your page inside of conditional comments. Then the script will make all your images working automatically.

回复收藏 0 原文