2011-03-23 20 views
6

मैं आईई 9 या एफएफ 4 में पृष्ठभूमि के रूप में काम करने के लिए एक सरल एसवीजी आयत प्राप्त करने की कोशिश कर रहा हूं और न ही मेरे लिए काम कर रहा है। यहां मेरा कोड है:एक सीएसएस पृष्ठभूमि के रूप में एसवीजी

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title></title> 
</head> 
<body> 
<div style="height:99px;background-image: url('bar.svg')"></div> 
<iframe src="bar.svg" height="99px"></iframe> 
</body> 
</html> 

आईफ़्रेम ग्राफ़िक दिखाता है लेकिन div नहीं करता है। कोई विचार जहां मैं गलत हो सकता है?

मैं एक काम उदाहरण here पाया: लेकिन मैं यह मुझे किसी भी मदद के लिए पागल हो ड्राइविंग कर रहा है

धन्यवाद इसे अपने आप को काम नहीं कर सकते :(

+0

क्या आप इस पृष्ठ का कोड या डेमो पोस्ट कर सकते हैं? कोड मुझे ठीक लग रहा है (लेकिन मैं उद्धरण 'url (' foo ') जोड़ता हूं और' पृष्ठभूमि 'को' पृष्ठभूमि-छवि 'में बदलता हूं)। – Blender

+0

दुर्भाग्यवश, मेरे पास वेब सर्वर तक पहुंच नहीं है। लेकिन मैंने उपरोक्त सीएसएस का इस्तेमाल पीएनजी छवियों के लिए किया है और यह ठीक काम करता है। – user169867

+0

ब्लेंडर के साथ सहमत हैं। मुझे संदेह है कि यूआरएल के आसपास लापता उद्धरण आपको काट रहे हैं। – Rozwel

उत्तर

8

धन्यवाद मदद के लिए हर किसी को। यह वास्तव में एक वेब सर्वर समस्या थी जहां एसवीजी के लिए गलत एमआईएम प्रकार & परोसा जा रहा था जिसने ब्राउज़र को सही ढंग से प्रस्तुत करने में असफल रहा।

यहां मेरे लिए यह तय किया गया है।

पहला मैंने वीएस 2010 के अंतर्निर्मित वेब सर्वर से आईआईएस एक्सप्रेस में स्विच किया। फिर मैंने अपनी वेब कॉन्फ़िगरेशन में जोड़ा:

<system.webServer> 
    <staticContent> 
     <mimeMap fileExtension=".svg" mimeType="image/svg+xml" /> 
    </staticContent> 
</system.webServer> 

अब सब ठीक से काम करता है।

+0

धन्यवाद! यह वास्तव में मेरी समस्या थी। – Pandincus

1

करता है आप के लिए यह jsfiddle काम करते हैं।।?

http://jsfiddle.net/B3mnk/embedded/result/

fwiw, मैं यह 'अच्छा n बड़ा बनाने के लिए एक पृष्ठभूमि के आकार जोड़ दिया है।

+0

हां यह करता है। मुझे लगता है कि समस्या वास्तव में कोड के साथ नहीं है लेकिन डब्ल्यू/विजुअल स्टूडियो 2010. मैं स्थानीय रूप से या ऑनलाइन पृष्ठों को चला सकता हूं, लेकिन अगर मैं उन्हें वीएस में चलाने की कोशिश करता हूं तो केवल आईफ्रेम काम करता है ... बहुत अजीब। – user169867

+0

मुझे डर है कि मुझे विजुअल स्टूडियो 2010 का कुछ भी पता नहीं है। अगर आप उन्हें वीएस में चलाते हैं, तो कौन सा ब्राउज़र इस्तेमाल किया जा रहा है? क्या यह कुछ अंतर्निहित है? – Matijs

0

उदाहरण के साथ कुछ लेख:

https://jwatt.org/svg/demos/xhtml-with-inline-svg.xhtml

http://helephant.com/2009/08/svg-images-as-css-backgrounds/

https://developer.mozilla.org/en/svg_in_html_introduction

http://www.broken-links.com/2010/06/08/using-svg-in-background-image/ - यह एक लेख के नीचे स्थित .png करने के लिए एक fallback है।

फ़ायरफ़ॉक्स में एक बग के रूप में रिपोर्ट:

https://bugzilla.mozilla.org/show_bug.cgi?id=231179

3

मुझे जूमला में भी यही समस्या थी! 2.5 गोडाडी लिनक्स सर्वर पर चल रहा है।

स्थापित करने और .htaccess फ़ाइल का पता अपने जूमला के रूट निर्देशिका में जाओ (या htaccess.txt यदि वह पहले से सेट नहीं हुआ है):

गहन शोध के बाद यहाँ कैसे मैं समस्या ठीक हो गई है

अब फ़ाइल में ये पंक्तियां जोड़ें:

AddType image/svg+xml svg 
AddType image/svg+xml svgz 

आराम, अपने एसवीजी फ़ाइल रेंडर करने के लिए मानक सीएसएस और एचटीएमएल गुण का उपयोग करें।

संबंधित मुद्दे