Question

我使用它作为我的一个div的背景，并为所有人声明了一个供应商前缀：

background: -webkit-linear-gradient(center top , #F6F6F6 0%, #FFFFFF 100%) repeat scroll;
background: -moz-linear-gradient(center top , #F6F6F6 0%, #FFFFFF 100%) repeat scroll;
background: -o-linear-gradient(center top , #F6F6F6 0%, #FFFFFF 100%) repeat scroll;
background: -ms-linear-gradient(center top , #F6F6F6 0%, #FFFFFF 100%) repeat scroll;
background: linear-gradient(center top , #F6F6F6 0%, #FFFFFF 100%) repeat scroll;

但是，它不适用于Chrome。我的div变得透明（因为它根本不识别背景）。我的Chrome版本版本29 ，应该是最新的。

我做错了吗？

Answer 1

正如评论中已经提到的，center是linear-gradient的无效属性。要深入了解语法，Mozilla Developer Network非常清楚：

linear-gradient([<angle> | to <side-or-corner> ,]? <color-stop> [,<color-stop>]+)
                \--------------------------------/ \----------------------------/
                  Definition of the gradient line       List of color stops

top，bottom，left和right是<side-or-corner>参数接受的唯一属性。

如果您无法手动操作渐变，可以使用各种在线工具来帮助您创建所需的渐变，其中一个更好的是Colorzilla的Ultimate CSS Gradient Generator。

即使使用供应商前缀，线性渐变也无法在Chrome中运行

1 个答案: