Is there a -moz-linear-gradient or a -webkit-gradient type CSS for Opera?

Is there a -moz-linear-gradient or a -webkit-gradient type CSS 开发者_JAVA技巧for Opera and other major browsers?

IE Does infact have support for gradients, Opera, however does not (as of 10.5). IE only supports gradient via the filter attribute for now, maybe in v10 this will change, but for now, you must use either the filter or -ms-filter attribute.

Example:

.simple-gradient {
    -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#ffffff');
    background-image: -moz-linear-gradient(top, #000, #fff);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#000), to(#fff));
}

For more more information:

General:

Gradients in Internet Explorer 9

Firefox:

https://developer.mozilla.org/en/CSS/-moz-linear-gradient

https://developer.mozilla.org/en/CSS/-moz-radial-gradient

Webkit:

http://webkit.org/blog/175/introducing-css-gradients/

Internet Explorer:

http://msdn.microsoft.com/en-us/library/ms532997%28VS.85%29.aspx

You can use SVG images as backgrounds in opera. you can even base64 encode these and put them directly in your stylesheet. i'm currently trying to find out if the latest beta (opera 11) supports css gradients but no luck yet.

As of Nov 6 2012 this works:

background-image: -webkit-linear-gradient(top, #585858, #2d2d2d); /*Webkit*/
background-image: linear-gradient(to bottom, #585858, #2d2d2d); /*Firefox and Opera*/
filter:  progid:DXImageTransform.Microsoft.gradient(startColorStr='#585858', EndColorStr='#2d2d2d'); /* IE6,IE7 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#585858', EndColorStr='#2d2d2d')"; /* IE8 */

for all support enable prefixs -webkit-, -moz, -ms-, -o- your code:

    background: rgb(0,255,244); /* only for old ie, opera, chrome, safari, firefox */
background-color: rgb(0,255,244); /* only for old ie */
background: url(all-ie.svg); /* only for ie 10-11 */
background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAwJSIgdmVyc2lvbj0iMS4xIiBoZWlnaHQ9IjEwMCUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+DQo8c3R5bGUgdHlwZT0idGV4dC9jc3MiPg0KLmdyYSwNCnJlY3QsDQpyZWN0LmdyYXsNCiAgICBmaWxsOiB1cmwoI2NvbCk7DQp9DQo8L3N0eWxlPg0KICA8ZGVmcz4NCiAgICA8bGluZWFyR3JhZGllbnQgaWQ9ImNvbCIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIGdyYWRpZW50VHJhbnNmb3JtPSJyb3RhdGUoNTApIj4NCiAgICA8c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjMDBmZmY0IiAvPg0KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2YwMDBiYSIgLz4NCiAgICA8L2xpbmVhckdyYWRpZW50Pg0KICAgIDwvZGVmcz4NCiAgICA8cmVjdCBjbGFzcz0iZ3JhIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBzdHlsZT0iZmlsbDogdXJsKCNjb2wpO3dpZHRoOiAxMDAlO2hlaWdodDogMTAwJTsiIGZpbGw9InVybCgjY29sKSIgLz4NCjwvc3ZnPg==); /* base64 for ie 11 */
background: -webkit-gradient(linear, left, rgba(0,255,244,1), rgba(240,0,186,1)); /* only for all ie versions and for old webkit browsers */
background: -o-linear-gradient(323deg, rgba(0,255,244,1) 0%, rgba(240,0,186,1) 100%); /* only for old opera versions */
background: -ms-linear-gradient(323deg, rgba(0,255,244,1) 0%, rgba(240,0,186,1) 100%); /* only for ie 10 */
background: -moz-linear-gradient(323deg, rgba(0,255,244,1) 0%, rgba(240,0,186,1) 100%); /* only for old firefox version */
background: -webkit-linear-gradient(323deg, rgba(0,255,244,1) 0%, rgba(240,0,186,1) 100%); /* standard (no ie 1.0+) */
background: linear-gradient(323deg, rgba(0,255,244,1) 0%, rgba(240,0,186,1) 100%); /* only standard */
/* filter for old browsers for test ie 1.0+  */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00fff4",endColorstr="#f000ba",GradientType=1);
-webkit-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00fff4",endColorstr="#f000ba",GradientType=1);
-moz-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00fff4",endColorstr="#f000ba",GradientType=1);
-ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00fff4",endColorstr="#f000ba",GradientType=1);
-o-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00fff4",endColorstr="#f000ba",GradientType=1);
/* zoom only for ie 1.0+ */
zoom: 1;
-ms-zoom: 1;