क्या क्रोम/सफारी ने हाल ही में मिश्रण-मिश्रण-मोड को

Question

संभाला है जिस तरह से मैंने क्रोम के हालिया संस्करण (शायद v56 या v57 का उपयोग करके कुछ हफ्ते पहले वेबपृष्ठ बनाया था, लेकिन मुझे निश्चित रूप से पता नहीं है) विकास के दौरान सफारी और फ़ायरफ़ॉक्स (ओएसएक्स पर)। http://dirkluetter.de/projecttype/kamera

फ़ायरफ़ॉक्स (v52 & v53) अभी भी इच्छित पृष्ठ को प्रदर्शित करता है।

जबकि सबसे हालिया क्रोम संस्करण (v58) अब और नहीं है।

मैंने मिश्रण-मिश्रण-मोड और पृष्ठभूमि-मिश्रण-मोड सीएसएस गुणों का उपयोग किया जो ठीक काम करते थे - और फिर भी एफएफ पर करते हैं। अब क्रोम/सफारी संपत्ति को अनदेखा कर रहा है, जबकि फ़ायरफ़ॉक्स अभी भी इच्छित पृष्ठ को प्रदर्शित करता है। क्या हाल ही में वेबकिट ब्राउज़र मिश्रण-मिश्रण-मोड को संभालने के तरीके में कुछ बदल गया था? मैं इस पर किसी बदलाव के बारे में कोई जानकारी नहीं ढूंढ सकता ... मिश्रण-मिश्रण-मोड और क्रोम के संबंध में कई अन्य प्रश्न हैं, लेकिन जिन लोगों ने मैंने जांच की है, वे मुझसे संबंधित नहीं हैं।

Answer 1

मुझे यकीन नहीं है कि क्या हो रहा है, लेकिन मैं इसे रूट तत्व में background: white जोड़कर क्रोम में काम करने के लिए प्राप्त कर सकता हूं और mix-blend-mode को शरीर के अंदर एक रैपर तत्व में ले जा सकता हूं।

html { 
 
    background: white; 
 
    display: flex; 
 
    height: 100%; 
 
} 
 

 
body { 
 
    margin: 0; 
 
    background-blend-mode: luminosity; 
 
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/1/15/AreeiroMetroLx2.JPG); 
 
    background-color: #006699; 
 
    background-size: cover; 
 
} 
 

 
div { 
 
    mix-blend-mode: multiply; 
 
} 
 

 
p { 
 
    color: magenta; 
 
}

<div> 
 
<p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam sollicitudin felis ultrices lacus venenatis, in porta dui sagittis. Aliquam maximus massa diam, ut elementum sem efficitur mollis. Proin mattis magna ante, sit amet semper nulla semper at. Vivamus hendrerit tortor nec lacus venenatis, vitae molestie odio consectetur. Vivamus fermentum id ligula et scelerisque. Etiam eu metus nec lacus aliquet convallis at sed mi. Integer euismod lorem risus, sit amet molestie mi egestas vitae. In quis consequat ligula. Pellentesque erat elit, ultricies et massa ut, cursus congue dolor. Suspendisse risus est, aliquet nec justo a, bibendum convallis justo. 
 
</div>