CSS背景url()没有出现在IE中,适用于FF / Safari

时间:2021-12-01 17:43:09

I'm debugging my website for the dreaded IE6 but I'm officially stumped.

我正在调试我的网站为可怕的IE6,但我正式难倒。

Appearance in Firefox: http://dl-client.getdropbox.com/u/5822/firefox.tiff

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

Appearance in IE6: http://dl-client.getdropbox.com/u/5822/ie6.tiff

在IE6中出现:http://dl-client.getdropbox.com/u/5822/ie6.tiff

Live site: Motolistr.com

现场:Motolistr.com

The following CSS works great in FF and Safari, but doesn't in IE6.

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

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

The following CSS DOES WORK in IE6, and it seems identical...(wtf)

以下CSS在IE6中工作,看起来相同......(wtf)

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

Also, my link/span button doesn't appear either- I assume this is the same type of issue.

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

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;
} 

Any ideas?

Thanks, Nick

4 个解决方案

#1


Seems like this one's been pretty well answered, but I'd like to add:

似乎这个问题得到了很好的回答,但我想补充一下:

Works in IE:

适用于IE:

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

Works in Firefox and Chrome but does not work in IE:

适用于Firefox和Chrome,但在IE中不起作用:

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

Without knowing IE needs that space (which seems like very marginal formatting) you can waste seeerious time, non?

不知道IE需要那个空间(这似乎是非常边缘的格式)你可以浪费很多时间,非?

#2


The order of attributes are wrong as i see. You need to put transparent in the beginning.

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

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

#3


The background property shorthand order is: colour image repeat position attachment

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

I suggest you correct to that format providing all properties, and if that fails (and you can confirm that the style is applied) try modifying your image path up and down to see if your base location is what you think it is.

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

#4


In Internet Explorer, URL inside CSS is relative to current page. in other browsers, URL inside CSS is relative to the CSS location. It is better to use fix URL for both. If you use Java servlet you can use dummy URL and handle the request in background from the servlet.

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

#1


Seems like this one's been pretty well answered, but I'd like to add:

似乎这个问题得到了很好的回答,但我想补充一下:

Works in IE:

适用于IE:

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

Works in Firefox and Chrome but does not work in IE:

适用于Firefox和Chrome,但在IE中不起作用:

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

Without knowing IE needs that space (which seems like very marginal formatting) you can waste seeerious time, non?

不知道IE需要那个空间(这似乎是非常边缘的格式)你可以浪费很多时间,非?

#2


The order of attributes are wrong as i see. You need to put transparent in the beginning.

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

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

#3


The background property shorthand order is: colour image repeat position attachment

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

I suggest you correct to that format providing all properties, and if that fails (and you can confirm that the style is applied) try modifying your image path up and down to see if your base location is what you think it is.

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

#4


In Internet Explorer, URL inside CSS is relative to current page. in other browsers, URL inside CSS is relative to the CSS location. It is better to use fix URL for both. If you use Java servlet you can use dummy URL and handle the request in background from the servlet.

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