16

我无法在 Safari 和 Chrome 中显示线性渐变。在 Firefox 中，它显示得很好。

我在尝试：

background: -webkit-linear-gradient(center top , #9E9E9E, #454545) repeat scroll 0 0 transparent;   
background:    -moz-linear-gradient(center top , #9E9E9E, #454545) repeat scroll 0 0 transparent;
background:     -ms-linear-gradient(center top , #9E9E9E, #454545) repeat scroll 0 0 transparent;
background:      -o-linear-gradient(center top , #9E9E9E, #454545) repeat scroll 0 0 transparent;

谢谢你的帮助。

4

5 回答 5

34

试试这个 - http://jsfiddle.net/fwkgM/1/

  background-color: #9e9e9e;
  background-image: linear-gradient(to bottom, #9e9e9e, #454545);

CSS3 请

于 2012-07-27T18:30:23.593 回答
7

你也可以试试这个：

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

这是一个非常好的 CSS3 渐变生成器。它对我来说效果很好。希望对你也有帮助！:D

于 2012-07-28T06:20:58.263 回答
7

对于跨浏览器兼容性，请尝试以下操作

background-color: #9e9e9e; /* fallback color if gradients are not supported */
background-image: -webkit-linear-gradient(bottom, rgb(213,12,18), #9e9e9e 40%); /* For Chrome 25 and Safari 6, iOS 6.1, Android 4.3 */
background-image:    -moz-linear-gradient(to bottom, #9e9e9e 60%, #454545 100%); /* For Firefox (3.6 to 15) */
background-image:      -o-linear-gradient(to bottom, #9e9e9e 60%, #454545 100%); /* For old Opera (11.1 to 12.0) */ 
background-image:         linear-gradient(to bottom, #9e9e9e 60%, #454545 100%); /* Standard syntax; must be last */
于 2016-01-13T06:46:51.480 回答
1 
background: -webkit-linear-gradient(left,transparent,black 50%,transparent); /* worked for me*/
于 2014-07-12T18:30:27.850 回答
1 
background-attachment: fixed; /* worked for me */
于 2019-10-17T10:47:43.137 回答