संपत्ति अस्पष्टता अंतिम और आधुनिक समाधान है और फ़ायरफ़ॉक्स 0.9+, सफारी 2, ओपेरा 9+, आईई 9+ और Google क्रोम के हर संस्करण के लिए काम करता है। -मोज़-अपारदर्शिता गुण 0.9 से पुराने फ़ायरफ़ॉक्स संस्करणों के लिए अपारदर्शिता गुण है जबकि -khtml-opacity गुण 1 से शुरू होने वाले सफारी संस्करणों के लिए है। फ़िल्टर गुण IE ब्राउज़र के लिए 5 से 9 तक अस्पष्टता जैसा प्रभाव देने के लिए है।पी>
सभी ब्राउज़रों के लिए CSS का उपयोग करके छवि अस्पष्टता के लिए कोड निम्नलिखित है -
उदाहरण
<!DOCTYPE html> <html> <head> <style> body{ font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; } img { width:270px; height:200px; } .transparent{ filter: alpha(opacity=30); -moz-opacity: 0.3; -khtml-opacity: 0.3; opacity: 0.3; } </style> </head> <body> <h1>Opacity example</h1> <img src="https://i.picsum.photos/id/505/800/800.jpg" > <img class="transparent" src="https://i.picsum.photos/id/505/800/800.jpg" > </body> </html>
आउटपुट
उपरोक्त कोड निम्न आउटपुट उत्पन्न करेगा -