如何在多个背景中使用供应商属性？

Question

我想在css中使用多个背景，目前支持Firefox 3.61，Chrome / Safari，据说是Opera10.5（不在gnu / linux上运行）。它工作正常，但我想使用线性渐变作为背景。它适用于Firefox，对Chrome没有任何作用，但我无法弄清楚如何让它同时适用于 。 任何线索？ http://snook.ca/archives/html_and_css/multiple-bg-css-gradients最接近匹配我需要的东西，但我无法使用Chrome工作。

Answer 1

我不是肯定的，但我的猜测是，Chrome还不支持。虽然一个元素上的多个背景图像和css渐变确实听起来不错，但我仍然建议使用多个元素，每个元素一个背景图像。出于某种原因，仍然有人使用IE浏览器，而CSS根本不是友好的。

Answer 2

这对我有用。似乎在webkit之后放置mozilla使得webkit确认了background-image的第二个参数的存在并且取消了它的旧声明。所以我在-webkit之前放置-moz声明。

  background-image: url("../images/block_stripe_bg.png"); /* for older browsers */
  background-image: url("../images/block_stripe_bg.png"), -moz-linear-gradient(center top, white, #dddddd); /* works for mozilla, ignored by other browsers */
  background-image: url("../images/block_stripe_bg.png"), -webkit-gradient(linear, center top, center bottom, from(white), to(#dddddd)); /* works for webkit, ignored by other browsers */
  background-repeat: repeat; /* older browsers */
  background-repeat: repeat, no-repeat; /* newer browsers should apply this to both backgrounds*/