-webkit-线性渐变不工作的铬

我有下面的CSS mozilla firefox-webkit-线性渐变不工作的铬

background: transparent -moz-linear-gradient(center top , #FED066, #FDB73D) repeat scroll 0% 0%;

但是，当我说下面样式chrome，opera和IE，他们没有工作似乎。下面有什么问题，因为它仅适用于FF而不适用于其他浏览器？

background: transparent -webkit-linear-gradient(center top , #FED066, #FDB73D) repeat scroll 0% 0%; 
background: transparent -o-linear-gradient(center top , #FED066, #FDB73D) repeat scroll 0% 0%; 
background: transparent -linear-gradient(center top , #FED066, #FDB73D) repeat scroll 0% 0%; 
background: transparent -ms-linear-gradient(center top , #FED066, #FDB73D) repeat scroll 0% 0%;

我也试图与刚刚-webkit-gradient，而不是-webkit-linear-gradient铬ATLEAST，但没有运气。

这是一个DEMO。如果您在FF中查看，则它适用于gradient background，但不适用于其他浏览器。

来源

2016-03-02 Guruprasad Rao

随着时间的推移，线性渐变的语法发生了很大变化，不同的浏览器（不同版本）可能会解释不同的版本，但会忽略其他版本。那里有发电机，会自动为你生成必要的代码，包括供应商前缀，所以我建议你去寻找其中的一个。 – CBroe

较新的浏览器不使用供应商前缀来使用该功能。您只需要使用标准声明：

center top在Chrome浏览器中不起作用。

试试这个：

background: linear-gradient(to bottom, #FED066 0%, #FDB73D 100%);

我总是用gradient-generator工具来设置梯度跨浏览器实现。

来源

2016-03-02 10:52:54

仍然没有运气.. :(** ['DEMO']（https://jsfiddle.net/Guruprasad_Rao/10jkk4vz/4/）** –

是的..这工程..谢谢.. :) –

是的。这真的很有用..再次感谢.. :) –

-webkit-线性渐变不工作的铬

回答

相关问题