IE9中的CSS渐变

我尝试使用“终极CSS渐变生成器”，结果如下：

background: #657575; /* Old browsers */
background: -moz-linear-gradient(left, #657575 0%, #758585 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right top, color-stop(0%,#657575), color-stop(100%,#758585)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(left, #657575 0%,#758585 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(left, #657575 0%,#758585 100%); /* Opera11.10+ */
background: -ms-linear-gradient(left, #657575 0%,#758585 100%); /* IE10+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#657575', endColorstr='#758585',GradientType=1 ); /* IE6-9 */
background: linear-gradient(left, #657575 0%,#758585 100%); /* W3C */

但至少在我的IE9版本中，梯度似乎不起作用。有没有办法用IE9生成一个简单的水平梯度？

---

这里有一个网站可以帮助您了解CSS渐变：

在我的选项中，对于固定高度的元素，我通常使用1px图像，并在元素的整个宽度上重复该图像。这样你就知道它在所有浏览器中看起来都是一样的

例如：

.element{
高度：30px；
背景：url（）repeat-x；
}

还有一些网站将为您创建这些渐变图像。
这里有一个免费使用的网站：

---

对于水平渐变（如问题中所述），您可能希望GradientType=1。此处记录：这是一种老方法。Css渐变现在是一个不错的选择。您还可以使用较少或sass混合插件来简化此操作

background:#fff;
background-image: -moz-linear-gradient(top, #fff, #000);
background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #fff),color-stop(1, #000));
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#ffffff', endColorstr='#000000');/*For IE7-8-9*/ 
height: 1%;/*For IE7*/ 

.element{
height: 30px;
background: url(<1px image location>) repeat-x;
}