Question

我正在为可怕的IE6调试我的网站，但我正式感到难过。

Firefox中的外观：http://dl-client.getdropbox.com/u/5822/firefox.tiff

IE6中的外观：http://dl-client.getdropbox.com/u/5822/ie6.tiff

以下CSS在FF和Safari中运行良好，但在IE6中则不行。

#search_sort{
background-image:url('../images/nav/bg-form.jpg');
padding:10px; 
border:1px solid #d13a3b;
margin-top:5px;
}

以下CSS在IE6中工作，看起来相同......（wtf）

#email_seller{
border:1px solid #d13a3b;
background-image:url('../images/nav/email-form-bg.jpg');
}

另外，我的链接/跨度按钮也没有出现 - 我认为这是同一类型的问题。

a.button {
    background: transparent url('../images/nav/button_bg_right4.gif') no-repeat scroll top right;
    color: #000;
    display: block;
    float: left;
    font: normal 18px arial, sans-serif;
    height: 36px;
    margin-right: 6px;
    padding-right: 18px; /* sliding doors padding */
    text-decoration: none;
}

a.button span {
    background: transparent url('../images/nav/button_bg4.gif') no-repeat;
    display: block;
    line-height: 24px;
    padding: 5px 0 7px 18px;
}

有什么想法吗？

谢谢，尼克

Answer 1

似乎这个问题得到了很好的解答，但我想补充一下：

在IE中工作：

background:transparent url('../images/nav/button_bg4.gif') no-repeat;

适用于Firefox和Chrome，但在IE中无效：

background:transparent url('../images/nav/button_bg4.gif')no-repeat;

如果不知道IE需要那个空间（这看起来像是非常边缘的格式化），你可以浪费很多时间，非？

Answer 2

我看到属性的顺序是错误的。你需要在开头放置透明。

background:transparent url('../images/nav/button_bg4.gif') no-repeat;

Answer 3

背景属性的简写顺序是：彩色图像重复位置附件

我建议您更正提供所有属性的格式，如果失败（并且您可以确认应用了该样式），请尝试上下修改图像路径以查看您的基本位置是否符合您的想法。

Answer 4

在Internet Explorer中，CSS内的URL与当前页面相关。在其他浏览器中，CSS内的URL相对于CSS位置。最好为两者使用修复URL。如果使用Java servlet，则可以使用虚拟URL并在servlet的后台处理请求。

CSS背景url（）没有出现在IE中，适用于FF / Safari

4 个答案: