CSS Implementation of background gradient in different browsers (except opera)

Here I wrote a demo CSS: /* Background color gradient */<br/>. gradient-top {<br/> filter: progid: DXImageTransform. microsoft. gradient (startcolorstr = "# add8e6", endcolorstr = "# ffffff", gradienttype = "0");/* for IE */<br/> * Height: 100%; <br/> Background:-moz-linear-gradient (top, lightblue, white 100%);/* for FF */<br/> Background:-WebKit-gradient (linear, 0 0, 0 100%, from (lightblue), to (white )); /* For Safari and chrome */<br/>}< br/>/* combines the effect and uses a horizontal gradient on IE, other browsers still use vertical gradient */<br/>. gradient-Tl {<br/> filter: progid: DXImageTransform. microsoft. gradient (startcolorstr = "# efefef", endcolorstr = "# ffffff", gradienttype = "1");/* for IE */<br/> * Height: 100%; <br/> Background:-moz-linear-gradient (top, # e0dfe0, whitelist 10%);/* for FF */<br/> background: -WebKit-gradient (linear, 0 0, 0 10%, from (# e0dfe0), to (white )); /* For Safari and chrome */<br/>}< br/>. gradient-left {<br/> filter: progid: DXImageTransform. microsoft. gradient (startcolorstr = "# efefef", endcolorstr = "# ffffff", gradienttype = "1");/* for IE */<br/> * Height: 100%; <br/> Background:-moz-linear-gradient (left, # e0dfe0, whitelist 10%);/* for FF */<br/> background: -WebKit-gradient (linear, 0 1, 10% 0, from (# e0dfe0), to (white);/* For Safari and chrome */<br/>} Specific you can refer to: http://css3html5.org/css/css3/2010/0622/124.htmlThe height above is used to solve the problem that cannot be displayed when no height is set in IE6 & 7.The above is the method of vertical gradient. Of course, there is also a method of diffusion: to convert linear into radial.But now there is a new way for WebKit kernel browsers (similar to Firefox ): // Vertical gradient <br/> Background:-WebKit-linear-gradient (left, white, black ); /* New Gradient for WebKit */<br/> // radiation gradient <br/> Background:-WebKit-radial-gradient (10% 30%, white, black ); /* New Gradient for WebKit */