Multi-browser-compatible gradient notation

Compatible multi-browser to each browser to write the corresponding CSS, too low version of the browser can only use the picture to do the background, the following is the current five major browsers to gradient support often some times need to use a gradient background, the use of long picture is a little too tall, so I wrote a small example, Compatible with multiple browsers to write a corresponding CSS for each browser, too low version of the browser can only use the picture to do the background.
Here are the current five major browsers for gradient support

The code is as follows:

<style type= "text/css" media= "screen" > #gradient {width:200px; height:200px;/* If the browser does not support gradients, use the image as the background */background : URL (gradient.jpg); /* Webkit:safari 4-5, Chrome 1-9 */background:-webkit-gradient (linear, 0% 0, 0% 100%, from (#ff6600), to (#339900)); /* Webkit:safari 5.1+, Chrome + */background:-webkit-linear-gradient (top, #ff6600, #339900); /* Firefox 3.6+ */background:-moz-linear-gradient (top, #ff6600, #339900); /* Opera 11.10+ */background:-o-linear-gradient (top, #ff6600, #339900); /* IE Ten */background:-ms-linear-gradient (top, #ff6600, #339900); /* IE < 10 */* Note: This line must be written at the end */FILTER:progid:DXImageTransform.Microsoft.Gradient (startcolorstr= #ff6600, Endcolorstr= #339900);} </style>

The code is as follows:

<p id= "Gradient" ></p>

When there is no IE6, when the world is peace ah. The evil ie.

"Recommended"

1. Special recommendation : "PHP Programmer Toolkit" V0.1 version download

2. Free CSS Online video tutorial

3. php.cn Lonely Nine-base (2)-css video tutorial

4. In-depth understanding of CSS3 gradients (gradients)