मेरे पास एक पृष्ठ है, जिसमें कई एसवीजी फाइलें शामिल हैं। उन एसवीजी फाइलों की स्टाइल को सिंक्रनाइज़ करने के लिए मैं सभी स्टाइलिंग जानकारी रखने के लिए एक स्टाइलशीट बनाना चाहता था।किसी आईएमजी टैग द्वारा एम्बेडेड एसवीजी में सीएसएस से लिंक करना
हालांकि, जब नीचे की तरह एसवीजी समेत, सीएसएस लागू नहीं होगा। किसी के पास इसका समाधान है या क्या <img src="..." />
द्वारा संदर्भित एसवीजी में अन्य (सीएसएस) फ़ाइलों से लिंक करना संभव नहीं है?
नीचे उदाहरण कोड देखें। सीधे ब्राउज़र में pic.svg
लोड करते समय, सभी शैलियों को लागू किया जाता है और कोई एक हरा आयताकार देख सकता है। लेकिन page.htm
खोलते समय सभी को एक काले आयताकार देखना है। तो जाहिर है कि परिभाषित शैलियों में से कोई भी लागू नहीं किया गया था।
page.htm
<!DOCTYPE html>
<html>
<body>
<img src="pic.svg" style="width: 100px; height: 100px;" />
</body>
</html>
pic.svg
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<?xml-stylesheet type="text/css" href="styles.css" ?>
<svg version="1.1"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 100 100"
>
<rect x="10" y="10" width="80" height="80" />
</svg>
styles.css
rect {
stroke: black;
fill: green;
}
EDIT
एक उत्तर से, कि थोड़े समय के लिए यहां दिखाई दिया, मुझे this link to the spec और निम्नलिखित उद्धरण मिला। मेरी राय में यह कहा गया है कि उपर्युक्त कोड काम करना चाहिए!
स्टैंड-अलोन एसवीजी दस्तावेज़ 'img', 'वस्तु' (एचटीएमएल) या 'छवि' (SVG) वाला कोई HTML या XML दस्तावेज़ में एम्बेडेड तत्वों
[...]
"आपके लिंक से हवाला देते हुए संदर्भित एसवीजी दस्तावेज़ के भीतर कहीं भी परिभाषित शैली पत्रक पूरे एसवीजी दस्तावेज़ पर लागू हो जाएंगी, लेकिन (शैली तत्वों या शैली में विशेषताओं, या शैली पत्रक प्रोसेसिंग निर्देश के साथ जुड़ा हुआ बाहरी स्टाइल शीट में में) ऐसा नहीं एक रेफरेंसिंग दस्तावेज़ (शायद एचटीएमएल या एक्सएचटीएमएल) को दोष दें। "
लेकिन उस स्थिति में मुझे फिर से एक एसवीजी फ़ाइल प्रति शैली परिभाषा होगी। और यह मेरे द्वारा पोस्ट किए गए स्पेस निकालने से कैसे संबंधित है? – Sirko
यदि आप स्टाइल परिभाषा साझा करना चाहते हैं तो आप छवि टैग का उपयोग नहीं कर सकते हैं। सुरक्षा मुद्दे विनिर्देश आवश्यकताओं को ओवरराइड करते हैं जो आमतौर पर ऐसी चीजों पर विचार नहीं करते हैं। –
जाहिर है, इसका मतलब यह भी है कि आप HTML फ़ाइल के माध्यम से लोड की गई एसवीजी फ़ाइलों से बाहरी फ़ॉन्ट्स का संदर्भ नहीं दे सकते हैं। –