IE6 中div的background-image图片高度被拉伸了，怎么解决？其他浏览器正常

Posted 2023-05-07

代码如下background-image:url(images/listicon.gif);width:4px;height:6px;display:inline-block;_display:inline;

background:url(images/listicon.gif) left top no-repeat;追问

加上no-repeat后图片显示不出来了，怎么回事呢

参考技术A background:url(images/listicon.gif) no-repeat;width:4px;height:6px;display:inline-block;_display:inline;

试试看这样写追问

很遗憾，加入no-repeat后图片不显示了

追答

_display:inline;这个是为什么写呢？去掉试试看

参考资料：http://www.52ladybug.com/

参考技术B _display:inline;这个东西去掉追问

_display:inline;是兼容IE6的，解决IE6对inline-block支持不好的bug
跟图片一点关系都没有

参考技术C background-image 不可能把图片拉伸，你图片有问题吧？追问

IE8和ff chrome等没问题，就IE6这样，IE7没试

CSS：IE：样式“背景颜色：rgba（...）”的版本

【中文标题】CSS：IE：样式“背景颜色：rgba（...）”的版本

【英文标题】：CSS: IE: Version of style "background-color:rgba(...)"

【发布时间】：2011-04-10 02:03:58

【问题描述】：

我需要有一个带有背景图像的 div，并且在该图像之上应该是一个 0.7 不透明度的黑色层。

为此，我正在使用：

background-color:rgba(0, 0, 0, 0.7);
background-image:url(/Images/hash-000000-pattern.gif);

这在除 IE 之外的所有应用程序中都能完美运行。在 IE 6、7 和 8 中，background-color:rgba(0, 0, 0, 0.7); 不会呈现。

在不更改标记的情况下，我可以在 CSS 中做些什么来在背景图像上创建一个暗淡不透明的黑色层吗？一些“过滤”风格？

【参考方案1】：

没有。您拥有的唯一选项是 ms-filters 或稍有不同的选项。

<!--[if IE]>

   <style type="text/css">

   .color-block 
       background:transparent;
       filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000050,endColorstr=#99000050);
       zoom: 1;
     

    </style>

<![endif]-->

也看到这个：http://www.hedgerwow.com/360/dhtml/rgba/demo.html

【参考方案2】：

我有一个类似的问题，为了克服它，我曾经在我的模态 div 上进行类，一个用于背景不透明度等。另一个只是为了显示微调器。这条路线似乎适用于我测试过的所有当前浏览器。

.modal 
    display: none;
    position: fixed;
    z-index: 1000;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;    
    background: rgba(255,255,255, .8);
    background-color: #fff;
    opacity: 0.8;
    filter: alpha(opacity=80);
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";

.spinner
    z-index: 1010;
    background-image: url(/_Layouts/Images/GEARS_AN.GIF);
    background-position: 50% 50%;
    background-repeat: no-repeat;