跨浏览器线性梯度规则答案

【问题标题】：cross-browser linear gradient rule跨浏览器线性梯度规则
【发布时间】：2012-02-14 16:14:21
【问题描述】：

我使用css3please 生成了一个从上到下的线性渐变规则，该规则适用于支持这种样式的所有浏览器，它给了我：

.box_gradient {
  background-color: #75A319;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#75A319), to(#9FCC1D)); /* Saf4+, Chrome */
  background-image: -webkit-linear-gradient(top, #75A319, #9FCC1D); /* Chrome 10+, Saf5.1+, iOS 5+ */
  background-image:    -moz-linear-gradient(top, #75A319, #9FCC1D); /* FF3.6 */
  background-image:     -ms-linear-gradient(top, #75A319, #9FCC1D); /* IE10 */
  background-image:      -o-linear-gradient(top, #75A319, #9FCC1D); /* Opera 11.10+ */
  background-image:         linear-gradient(to bottom, #75A319, #9FCC1D);
}

我对这个类的最后一条规则有点怀疑：

  background-image: linear-gradient(to bottom, #75A319, #9FCC1D);

直觉上，人们会期望：

  background-image: linear-gradient(top bottom, #75A319, #9FCC1D);

有人可以证实或消除我的怀疑吗？

【问题讨论】：

标签： css

【解决方案1】：

MDN 在此解释 linear-gradient 属性：https://developer.mozilla.org/en/CSS/linear-gradient

你从 css3please 得到的是正确的。 to bottom 指定角度。在这种情况下，角度是 180 度。

【讨论】：