在FireFox中有效在Chrome中无效吗？ background-image：线性渐变（到底部，rgb（53,53,53），rgb（34,34,34））;

Question

background-image: linear-gradient(to bottom, rgb(53, 53, 53), rgb(34, 34, 34));

为什么此CSS属性在Chrome中无效但在Firefox中有效？关于如何在两种浏览器中使其有效的任何建议？

Answer 1

Chrome使用不同的代码将其渲染为背景渐变。

您可以找到代码here

的示例

Answer 2

您需要使用特定于浏览器的供应商前缀。

我通常使用一个生成器来为所有浏览器提供代码。

http://www.colorzilla.com/gradient-editor/

Answer 3

更新WebKit以匹配规范语法，因此您应该像这样获得最大的浏览器支持：

background: -webkit-gradient(linear, center top, center bottom, from(#917c4d), to(#ffffff));
background: -webkit-linear-gradient(#917c4d, #ffffff);
background: -moz-linear-gradient(#917c4d, #ffffff);
background: -o-linear-gradient(#917c4d, #ffffff);
background: -ms-linear-gradient(#917c4d, #ffffff);
background: linear-gradient(#917c4d, #ffffff);