वहाँ अलग छवियों तैयार करने के लिए बिना एक पार ब्राउज़र संगत तरीके से इस प्रभाव को प्राप्त करने के लिए एक रास्ता है?HTML/CSS में सफेद अस्पष्टता प्रभाव हासिल करने
असल में जिस फ्रेम पर पाठ है, उसमें 50% अस्पष्टता का एक सफेद ओवरले है .. मुझे एक समाधान चाहिए जिसमें पृष्ठभूमि के अलावा कोई अन्य छवि बनाने में शामिल नहीं है लेकिन मुझे नहीं पता कि यह संभव है या नहीं!
कोशिश RGBA, उदा
div { background-color: rgba(255, 255, 255, 0.5); }
हमेशा की तरह, इस हर एक ब्राउज़र अब तक लिखी में काम नहीं करेगा।
काम करता है, लेकिन यह, IE के साथ संगत नहीं है तो मैं 50% अल्फा के साथ 1 पिक्सेल की एक पृष्ठभूमि छवि का उपयोग करने के लिए किया था। फिर भी धन्यवाद :) – Jack
यदि आप ब्राउज़र समर्थन के कारण rgba का उपयोग नहीं कर सकते हैं, और आप अर्ध-पारदर्शी सफेद पीएनजी शामिल नहीं करना चाहते हैं, तो आपको दो स्थानांतरित तत्व बनाना होगा। एक सफेद बॉक्स के लिए, अस्पष्टता के साथ, और एक ओवरलैड टेक्स्ट, ठोस के लिए एक।
body { background: red; }
.box { position: relative; z-index: 1; }
.box .back {
position: absolute; z-index: 1;
top: 0; left: 0; width: 100%; height: 100%;
background: white; opacity: 0.75;
}
.box .text { position: relative; z-index: 2; }
body.browser-ie8 .box .back { filter: alpha(opacity=75); }<!--[if lt IE 9]><body class="browser-ie8"><![endif]-->
<!--[if gte IE 9]><!--><body><!--<![endif]-->
<div class="box">
<div class="back"></div>
<div class="text">
Lorem ipsum dolor sit amet blah blah boogley woogley oo.
</div>
</div>
</body>
के संभावित डुप्लिकेट [सीएसएस: स्टाइलिंग छवियों को पार दौरा ब्राउज़र रास्ता/पार ब्राउज़र अस्पष्टता] (http://stackoverflow.com/questions/1438671/css-styling-visited-images-cross-browser -वे-क्रॉस-ब्राउज़र-अस्पष्टता) –
डुप्ली देखें। आप एक अलग DIV हालांकि –
में काले पाठ रखा लेकिन ध्यान दें कि IE6 के लिए फिल्टर वास्तव में (से अतिरिक्त जो एक IE6 कार्य केंद्र शायद ज्यादा के लिए नहीं है) suckers संसाधन हैं करना होगा। – Hannes