css3.0线性渐变

Webkit引擎
-webkit-gradient(linear, left top, right top, from(#F00), to(#000) ); /* webkit老式语法 可支持较低版本的Android手机   */
-webkit-linear-gradient(top, #F00, #0F0, #000); /*webkit新式语法  Safari 5.1+, Chrome 10+ */

Gecko引擎
-moz-linear-gradient(top, #F00 #0F0, #000); /* firfox 3.6+ */

Presto引擎
-o-linear-gradient(top, #F00, #0F0, #000); /* Opera 11.10+ */

/* IE */
-ms-linear-gradient(top, #ff6600, #339900); /* IE10 */
/* 注意：这一行必须写在最后 */
filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr=#ff6600, endColorStr=#339900); /* IE8 IE9 */

/* W3C标准　*/
linear-gradient([<angle> | to <side-or-corner>], <color1>, <color2>, <color3>, …);
eg:
    linear-gradient(45deg, #F00, #0F0, #000);
    linear-gradient(to right top, #F00, #0F0, #000);

注意：W3C标准渐变方向要么用角度，要么用方向词但是要加 to

整理：
.lgred{
    background-image:-webkit-gradient(linear, left top, right top, from(#F00), to(#000) );
    background-image:-webkit-linear-gradient(top, #F00, #0F0, #000);
    background-image:-moz-linear-gradient(top, #F00 #0F0, #000);
    background-image:-o-linear-gradient(top, #F00, #0F0, #000);
    background-image:-ms-linear-gradient(top, #F00, #0F0, #000);
    background-image:linear-gradient(to top, #F00, #0F0, #000);
    filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr=#F00, endColorStr=#000);
}