CSS Sprites 图像在 IE 中渲染质量较差

发布于 2024-07-23 06:03:57 字数 893 浏览 7 评论 0原文

我有一个 CSS 图像精灵,它在 FF 和 IE 中呈现完美。 问题是渲染的图像在 IE 中看起来质量很差。

以前有人遇到过这种情况吗? 你怎么修好它的? 我需要 CSS 精灵来节省带宽和请求。

替代文字 http://cupacupelor.ro/img/problem.png

.blackmncenter2
{
    float:left;
    height:32px;
    line-height:32px;
    background-image:url(../img/top-menu-center.png);   
    background-repeat:repeat-x;
    background-position:left -64px;
    color:White;
    cursor:pointer;
    display:block;
}

图片:

http://cupacupelor.ro/img/problem.png

演示:

http://cupacupelor.ro/

黑顶菜单,发布后最多 7 天可用。 用 FF 试试,然后用 IE 试试。

I have a CSS image sprite and this renderes perfect in FF, also IE.
The problem is the rendered image looks to have poor quality in IE.

Has anyone encountered this before? How did you fix it? I need CSS sprites to save bandwidth and requests.

alt text http://cupacupelor.ro/img/problem.png

.blackmncenter2
{
    float:left;
    height:32px;
    line-height:32px;
    background-image:url(../img/top-menu-center.png);   
    background-repeat:repeat-x;
    background-position:left -64px;
    color:White;
    cursor:pointer;
    display:block;
}

Image:

http://cupacupelor.ro/img/problem.png

Demo:

http://cupacupelor.ro/

The black top menu, available max 7 days from posting.
Try it with FF, then with IE.

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

扫码二维码加入Web技术交流群

发布评论

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

评论(3

北音执念 2024-07-30 06:03:57

您需要 PNG 格式的图形吗? 传统上,Internet Explorer 6.0 及更早版本存在一些与 PNG 格式相关的问题,最明显的是缺乏对 Alpha 通道的支持。

如果没有这个 Alpha 通道,IE 就无法正确渲染 PNG 图像中表示的透明度。 这可能会稍微扭曲图像,或者给您带来与您期望看到的不同的东西。

如果没有更多细节,就很难辨别导致问题的原因(或者问题首先是什么)。

Do you need to have the graphic in PNG format? Traditionally, Internet Explorer 6.0 and earlier had some issues relating to the PNG format, most notably the lack of support for the alpha channel.

Without this alpha channel, IE can't render the transparency represented in PNG images correctly. This might distort the image a bit, or give you something other than what you were expecting to see.

Without more details it's hard to discern what's causing the problem (or what the problem is in the first place).

千年*琉璃梦 2024-07-30 06:03:57

请定义“质量差”。 也许是因为你的 CSS 精灵没有保留原始图像的透明度?

Please define "poor quality". Maybe it's because your CSS sprite didn't preserve the original image's transparency?

情话已封尘 2024-07-30 06:03:57

奇怪的行为,出乎意料。

即使我有 IE 7 和没有透明度的 PNG,使用 background-position 样式渲染的背景在 IE 中也会很奇怪。

将图片保存为JPG并修改CSS即可解决问题。

比起你们,我对答案进行了投票。

Strange behavior, not expected.

Even if I have IE 7 and PNG with no transparency, backgrounds rendered with background-position style work weird in IE.

Saving the image as JPG and modify the CSS solved the problem.

Than you guys, I voted the answers.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文