【问题标题】:ie6 css background image problemie6 css背景图片问题
【发布时间】:2009-08-26 20:20:40
【问题描述】:

我有一个在背景中显示 png 图像的 CSS 样式。它适用于所有浏览器,除了 ie6。

在 ie6 中,免费图像被拉伸以适合块。我该如何解决这个问题?这是我用来执行此操作的 CSS。

.error
{
    color: #D8000C;
    background-color: #FFBABA;
    background-image: url('error.png');
}

IE7/FF3.5

IE6

【问题讨论】:

  • 那张图片是透明的PNG吗?
  • 我以前从未见过这种情况!

标签: internet-explorer-6 css


【解决方案1】:

您可能使用 IE6 的 png 透明度修复脚本,我认为问题出在此处,因为它可能应用了缩放方法。

阅读this page上的cmets。

您的 png 透明度修复文档可能会涵盖这一点。

我个人发现在 IE 6.0 中使用透明 png 是一件很头疼的事,尽管有各种修复方法。我知道这不是原始答案,但如果你真的需要在这里支持 IE 6.0,我可能会做一个条件检查并用 gif 或 jpg 版本替换图像,而不是依靠黑客来支持这个。或者干脆放弃 IE 6.0,今年,我已经说服每个客户在他们的新项目中不支持 IE 6.0。说真的,该死的时候该死的东西不再让我们的职业生活变得如此该死的悲惨了。

【讨论】:

  • m 已经为此使用了 JQuery PNGFix 插件,并且它在所有浏览器中运行良好,但这个问题在 ie6 上仍然存在
  • 听着 strager,你使用的插件将使用 AlphaImageLoader 来渲染它......很明显,这在其他浏览器上运行良好,因为它们首先不需要 pngFix
  • "...该死的时候该死的东西不再让我们的职业生活变得如此该死的悲惨了。"我喜欢它
【解决方案2】:

如果您使用的是AlphaImageLoader filter,请确保sizingMethod='scale' 不存在。将其删除或将其设置为 image 而不是 scale

【讨论】:

  • m 没有使用 AlphaImageLoader。
  • @s_ruchit,是的。您正在使用的插件使用过滤器。编辑它的源代码,并可能就这个问题联系插件的作者。
【解决方案3】:

Belatedpng 是我为这个问题找到的最好的脚本: http://www.dillerdesign.com/experiment/DD_belatedPNG/

【讨论】:

    【解决方案4】:

    为背景图片和背景位置设置实际宽度和高度。

        .error
    {
        color: #D8000C;
        background-color: #FFBABA;
        background-image: url('error.png');
        background-position:left;
        width:251px; 
        height:72px; 
        background-repeat:no-repeat;
    }
    

    这里的宽度和高度是error.png 图像的实际大小。希望有帮助。

    【讨论】:

    • 这行不通。宽度和高度将应用于实现样式“错误”的元素。
    • 如果您在 div 中添加具有图像大小的另一个元素,并让图像拉伸到它,则此 可以 工作。但是,这将是一种解决方法...
    猜你喜欢
    • 2010-12-12
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2010-10-20
    • 2019-03-03
    • 2023-04-07
    • 2022-10-16
    相关资源
    最近更新 更多