एफएफ और IE सीएसएस

Question

मैं इस

#Banner { 
content: url(../Banners/prussia-awesomeness.gif); 
width: 1000px; 
} 

तरह सीएसएस के साथ एक छवि के लिए स्रोत सेट कर रहा हूं से img src लोड नहीं यहाँ मेरी छवि

<div id="Header" class="Header"> 
     <img id="Banner" src="as"/> 
    </div> 

गूगल क्रोम में छवि लोड है उचित img src (../Banners/prussia-awesomeness.gif)

इंटरनेट एक्सप्लोरर और फ़ायरफ़ॉक्स में यह "as" src को रखता है।

क्या यानी एफएफ सीएसएस से छवि स्रोत लोड करने का समर्थन नहीं करता है?

संपादित करें:

जोड़ने

#Banner:after { 
content: url(../Banners/prussia-awesomeness.gif); 
width: 1000px; 
} 

यह फ़ायरफ़ॉक्स में काम किया है, यानी हालांकि अभी भी सहयोग करने के लिए मना कर दिया। इससे पहले कि (के साथ: और:

भी जोड़ने की कोशिश की :), जो किसी भी ब्राउज़र

Answer 1

को दोहरे उद्धरण चिह्नों को हटाने की कोशिश करो ऐसा लगता है कि सीएसएस सामग्री संपत्ति आईएमजी लेकिन आईई & सफारी के लिए अन्य तत्वों के लिए काम नहीं करता। this फिडल देखें। सफारी के लिए this देखें।

HTML:

<div id="Header" class="Header"> 
     <img id="Banner1" src="as"/> 
    <h1 id="Banner">test</h1> 
    </div> 

सीएसएस:

#Banner:before { 
content: url(http://w3c.org/2008/site/images/favicon.ico); 
width: 1000px; 
} 
#Banner1:before { 
content: url(http://w3c.org/2008/site/images/favicon.ico); 
width: 1000px; 
} 

यह IE8 के साथ काम नहीं कर सकते हैं अगर आप DOCTYPE नहीं है! निर्दिष्ट।

एफएफ के लिए आपको इसका उपयोग करने की आवश्यकता है: पहले या: छद्म तत्वों के बाद इसे काम करने के लिए। अधिक जानकारी के लिए this के माध्यम से जाएं।

Answer 2

MDN के अनुसार

में कोई अंतर नहीं किया जाता,

सामग्री सीएसएस संपत्ति के साथ प्रयोग किया जाता है :: पहले और :: किसी तत्व में सामग्री उत्पन्न करने के लिए छद्म-तत्वों के बाद।

तो, :after या :before की तरह छद्म तत्वों (एकल बृहदान्त्र IE8 संगतता के लिए है) के साथ content का उपयोग करें। कुछ इस तरह:

#Banner:after { 
    content: url(../Banners/prussia-awesomeness.gif); 
    width: 1000px; 
} 

Answer 3

एक सामग्री मूल्य

#Banner:after { 
    content: url(../Banners/prussia-awesomeness.gif); 
    width: 1000px; 
}