0

当站点在 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 与背景一起使用,当页面加载时,我会在几秒钟内看到这种颜色,然后它就消失了。

这有什么问题?

4

6 回答 6

2

我相信背景应该按这个顺序写出来:背景:颜色位置大小重复原点剪辑附件图像;也许IE是唯一关心的浏览器?

如果这不起作用,可以尝试分别添加您需要的每个背景值:背景颜色、背景位置、背景大小、背景重复、背景原点、背景剪辑、背景附件和背景图像。

另外作为旁注,您可能想尝试注释掉 css“behavior:url(js/PIE.htc)”中的最后一行。我知道有时这些东西喜欢与其他属性发生冲突。我自己从未使用过 PIE,但值得一试。

于 2013-05-14T19:27:35.517 回答
1

先上色:

background: #3b3d3e url(../images/button-bg.gif) 0 0 repeat-x;
于 2013-05-14T19:21:29.980 回答
0

尝试添加zoom:1到 .button

这会触发 IE7 上的 hasLayout 属性。详细说明: 关于布局

于 2013-05-14T19:44:02.200 回答
0

我想我已经修复了,但仍然不知道是什么原因......我删除了

 behavior:url(js/PIE.htc); 

从中,它完美地工作......

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

于 2013-05-14T19:48:17.120 回答
0

我还没有在我的网站上尝试过这个,因为服务器已经关闭,但可能值得研究一下 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 看看

于 2013-05-14T20:19:24.757 回答
0

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

PIE 是否有效?— IE 7 上的按钮是否有圆角?

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

于 2013-05-15T18:06:28.103 回答