CSS 多背景显示在 Chrome 中，但不显示在 IE 或 Firefox 中答案

【问题标题】：CSS multiple background shows up in Chrome but not IE or FirefoxCSS 多背景显示在 Chrome 中，但不显示在 IE 或 Firefox 中
【发布时间】：2026-01-30 12:45:01
【问题描述】：

我看到一些关于背景的答案没有出现在 Chrome 上，而是出现在 IE 和 Firefox 上，但这只是在刷新缓存。尝试为background-size 指定条件并没有改变任何东西。不知道为什么它可以在 Chrome 上运行，但在 Firefox 或 IE 中根本不显示。也许 IE 无法处理多个背景，但至少我想尽可能在 Firefox 上安装它。有什么想法吗？

代码如下：

body{
background-image: url(http://pocketyourpower.com/index.php/admin/cms_wysiwyg/directive/___directive/e3ttZWRpYSB1cmw9Ind5c2l3eWcvYmFja2dSTy5qcGcifX0,/key/5bf910ba704cb793ba25145022f9caa3/), 
    url (http://pocketyourpower.com/index.php/admin/cms_wysiwyg/directive/___directive/e3ttZWRpYSB1cmw9Ind5c2l3eWcvYmFja2dST3JpZ2h0LmpwZyJ9fQ,,/key/5bf910ba704cb793ba25145022f9caa3/);
background-size:93px 99px;
background-repeat: repeat-y, repeat-y;
background-position:left, center right;
}

显示良好here。

不知道为什么不能在 Mozilla 或 IE 上运行。

【问题讨论】：

网址中的逗号会导致解析错误吗？尝试引用图像的 url。此外，图像受密码保护，因此无法在小提琴中访问。

标签： css multiple-browsers background-image

【解决方案1】：

我不知道你在这里做什么，你的图片网址根本没有指向图片......

Demo

CSS

body {
  background-image: url(http://www.xtec.cat/centres/a8026907/Index/google.jpg), url(http://www.posicionamientoenlaweb.es/wp-content/uploads/2011/03/google.png);
  background-size:93px 99px;
  background-repeat: repeat-y, repeat-y;
  background-position:left, center right;
}

【讨论】：

谢谢！这是我的图像，它们指向天知道是什么。在我将它们上传到 ftp 站点并使用该 url 之后，它就起作用了。

【解决方案2】：

我假设您正在使用 Magento。

在这种情况下，解决方案是只更改 admin 中的一项设置：

System -> Configuration -> General -> Content Management -> Use Static URLs for Media Content in WYSIWYG for Catalog 到 Yes

由于您的图片 URL 是由 Magento 所见即所得编辑器生成的，并且上面的设置设置为 No，因此您在前端有损坏的链接。

【讨论】：