क्रॉस ब्राउज़र ओपेसिटी ग्रेडियेंट (रंगीन ग्रेडियेंट नहीं) को कैसे कार्यान्वित करें

Question

मैं क्रॉस ब्राउज़र अस्पष्टता ढाल (रंग ढाल नहीं) कैसे कार्यान्वित कर सकता हूं? कोड निम्न देखें:

<div style="background-color:Red;display:block;height:500px;width:500px;filter:alpha(Opacity=100, FinishOpacity=0, Style=1, StartX=0, StartY=0, FinishX=0, FinishY=500)"></div> 

यह IE में ठीक काम करता है, लेकिन नहीं फ़ायरफ़ॉक्स जैसे अन्य ब्राउज़रों में, safari..etc। फ़ायरफ़ॉक्स के बराबर वाक्यविन्यास क्या है? कृपया मुझे ढाल छवि का उपयोग करने का सुझाव न दें।

Answer 1

हाल ही में फ़ायरफ़ॉक्स संस्करणों के लिए -moz-linear-gradient और वेबकिट ब्राउज़र के लिए -webkit-gradient है। उन दोनों के लिए पारदर्शिता rgba रंगों का उपयोग करके संभव होनी चाहिए।

https://developer.mozilla.org/en/CSS/-moz-linear-gradient
http://developer.apple.com/safari/library/documentation/...

केवल वास्तविक 100% पार ब्राउज़र संगत समाधान हालांकि एक छवि है।

Answer 2

धन्यवाद @deceze,

मैं अन्य लोगों को एक ही आवश्यकता

top:0px; 
    opacity: 0.6;  
    width: 1944px; 
    height: 896px; 
    position: absolute; 
    z-index: 500; 
background-color:#dcdcdc; 
     /* For WebKit (Safari, Google Chrome etc) */ 
     background: -webkit-gradient(linear, left top, left bottom, from(#dcdcdc), to(rgba(215,212,207,0))); 
     /* For Mozilla/Gecko (Firefox etc) */ 
     background: -moz-linear-gradient(top, #dcdcdc, rgba(215,212,207,0)); 
     /* For Internet Explorer 5.5 - 7 */ 
     filter:alpha(Opacity=70, FinishOpacity=0, Style=1, StartX=1242, StartY=0, FinishX=1242, FinishY=696); 
     /* For Internet Explorer 8 */ 
     -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70, FinishOpacity=0, Style=1, StartX=1242, StartY=0, FinishX=1242, FinishY=696)";