CSS的背景图像不能在IE浏览器上工作？

Question

当站点位于LOCALHOST上时，此CSS样式可在所有浏览器上完美运行。 但是当我将网站上传到实时服务器时，它也可以在除IE之外的所有浏览器上使用。

背景图像不显示。

.button {
font-family:Arial, Helvetica, sans-serif;
display:inline-block;
position:relative;
background:url(../images/button-bg.gif) 0 0 repeat-x #3b3d3e;
border:1px solid #3b3d3e;
font-size:11px;
color:#fff;
font-weight:bold;
text-decoration:none;
padding:1px 9px;
margin-right:7px;
border-radius:2px;
-moz-border-radius:2px;
-webkit-border-radius:2px;
behavior:url(js/PIE.htc);
 }

注意：如您所见，我在背景上使用＃3b3d3e颜色，当页面加载时，我看到此颜色一秒钟，然后消失了。

这有什么问题？

Answer 1

我相信背景应该按以下顺序写出：背景：颜色位置大小重复原点剪辑附件图像； 也许IE是唯一关心的浏览器？

如果这样不起作用，则可以尝试分别添加您需要的每个背景值：背景颜色，背景位置，背景大小，背景重复，背景来源，背景剪辑，背景附件和背景图像。

另外，您还可以尝试注释掉CSS的最后一行“ behavior：url（js / PIE.htc）”。 我知道有时这些事情会与其他属性发生冲突。 我自己从未使用过PIE，但值得一提。

Answer 2

颜色优先：

background: #3b3d3e url(../images/button-bg.gif) 0 0 repeat-x;

Answer 3

尝试将zoom:1添加到.button

这将触发IE7上的hasLayout属性。 详细说明在这里： 关于布局

Answer 4

我想我已解决问题，但仍然不知道是什么原因...我删除了

 behavior:url(js/PIE.htc); 

从它，它完美地工作...

我很确定文件PIE.htc在那里，但是我不知道出了什么问题。 任何人？？

Answer 5

我尚未在我的网站上尝试过此操作，因为服务器已关闭，但可能值得研究Modernizr http://modernizr.com/

我很难获取背景图像以显示从本地到服务器的移动，而最终要做的就是使用图像的完整路径。

如果实际上是浏览器冲突问题，则应该可以解决。

另外，您是否尝试过注释behavior:url(js/PIE.htc); ？ 这可能就是适合的原因。

当我在CSS中放置背景图片时，我会这样输入：

background-image: url("path/to/image.img"); background-repeat:no-repeat;

background-color:#color;

我看到您尝试过此方法，并且正在尝试考虑几种选择，使用Z-index是否会影响您要尝试执行的操作？

让Modernizr看一看

Answer 6

这可能是本地主机和服务器环境之间的相对路径问题。 请参阅CSS 3 PIE已知问题页面上的详细说明。 http://css3pie.com/documentation/known-issues/#relative-paths

PIE确实在工作吗？ — IE 7的按钮上是否有圆角？

这也可能会有所帮助。 http://css3pie.com/documentation/known-issues/#z-index