修复了 Chrome 中的后台工作，但不是 Firefox？答案

【问题标题】：Fixed Background Works in Chrome but Not Firefox?修复了 Chrome 中的后台工作，但不是 Firefox？
【发布时间】：2011-05-25 10:53:24
【问题描述】：

我错过了什么吗？

body {
   margin: 0 auto;
   padding: 0;
   font-family: helvetica, sans-serif, Arial;
   color: #333333;
   font-size: 13px;
   background: white url(images/bg.jpg) no-repeat fixed top center;
}

【问题讨论】：

您实际想要的中心是固定的背景图像还是中心的移动背景图像
@sandeep 已修复，就像在 Chrome 中一样
你能在 jsbin.com 中展示你的例子吗？
@sandeep 如果需要，您可以在我的个人资料中查看该网站。 - 抱歉，我不认为我可以使用 JSBin，因为它是一个 wordpress 网站...

标签： css background fixed

【解决方案1】：

在SearchAndShare.css 中有一条body {background-attachment: inherit;} 规则，因为此工作表的调用时间晚于您的主工作表，因此会否决主工作表中的"fixed"

删除该规则可以修复 Firefox，不确定继承是否是对后台附件的有效调用，但即使是这样，也意味着您需要设置 background-attachment: fixed" on thehtmlelement so thebody 有一些可以继承的东西

更新：是的，如果您不想弄乱插件SearchAndShare.css 文件，将html {background-attachment: fixed} 添加到您的主工作表也可以解决此问题

【讨论】：

谢谢@clairesuzy！现在已经修好了。惊人。 =)

【解决方案2】：

使用简写background属性时，属性的顺序应该是

颜色
图片
重复
附件
位置

尝试按如下方式更改样式（更改repeat 顺序并添加attachment 看看是否有所不同：

background: white url(images/bg.jpg) no-repeat fixed center 0;

然后删除background-attachment:fixed;

编辑： 显然混合关键字和值会导致某些浏览器阻塞。所以centre 0 可能是FF 中的问题。

试试50% 50% 或center center

【讨论】：

@Tara。我看到了一些我以前没见过的东西，并编辑了上面的回复。仅供参考。
这个'背景：白色url（images/bg.jpg）无重复固定顶部中心；'比 'center center' 或 '50% 50%' 效果更好，因为它们将 bg img 放置在页面的垂直中心。但是，在 Firefox 中，bg 仍然不像在 Chrome 中那样粘着。无论如何感谢您的更新。

【解决方案3】：

试试这个

background: url(under.gif) no-repeat fixed 10% 20%;

或

width: 780px;
font-family: Arial;
font-size: 0.8em;
background: url(images/bg.jpg) top left repeat-y;
border: 1px solid #e6930f

希望这能帮助...:)

【讨论】：

对不起@harishtps，但是那个 CSS 真的不起作用，我不知道你为什么觉得需要添加橙色边框、不同的背景图像和字体大小？