2008-09-18 21 views
25

मान लें कि मेरे पास मेरे एप्लिकेशन की जड़ के नीचे एक "छवियां" निर्देशिका निर्देशिका है। मैं .css फ़ाइल के भीतर से, एएसपी.NET ऐप रिश्तेदार पथ का उपयोग करके इस निर्देशिका में एक छवि का संदर्भ कैसे दे सकता हूं।संदर्भ एप रिश्तेदार वर्चुअल पथ .css फ़ाइल

उदाहरण:

जब विकास में, ~/छवियाँ के पथ/Test.gif हल हो सकता है /MyApp/Images/Test.gif को जबकि, उत्पादन में, यह को हल कर सकते हैं/छवियां/Test.gif (एप्लिकेशन के लिए वर्चुअल निर्देशिका के आधार पर)। मैं, जाहिर है, पर्यावरण के बीच .css फ़ाइल को संशोधित करने से बचना चाहता हूं।

मुझे पता है कि आप पृष्ठ का उपयोग कर सकते हैं। ReesolveClientUrl समय-समय पर नियंत्रण के स्टाइल संग्रह में एक यूआरएल इंजेक्ट करने के लिए। मैं ऐसा करने से बचना चाहता हूं।

उत्तर

8

मामले में आप आप ऐसा कर सकता है पता नहीं था ...

आप एक सीएसएस में एक संसाधन के लिए एक रिश्तेदार पथ देना यदि यह सीएसएस फ़ाइल के सापेक्ष है, सीएसएस सहित फाइल नहीं।

background-image: url(../images/test.gif); 

तो यह आपके लिए काम कर सकता है।

+4

मामला नहीं। यह युक्त पृष्ठ के यूआरएल के सापेक्ष है। यही समस्या है। – pstanton

+1

मैं उपरोक्त "गलत" धारणा का उपयोग करके कई ब्राउज़रों में सक्रिय रूप से इसके साथ काम कर रहा हूं। –

+0

http://haacked.com/archive/2006/01/12/CSSURLReferencesAndURLRewriting.aspx और http://htmlhelp.com/reference/css/units.html देखें ("आंशिक URL स्टाइल शीट स्रोत के सापेक्ष व्याख्या किए जाते हैं, एचटीएमएल स्रोत के लिए नहीं। ") –

-3

.css फ़ाइल के अंदर आप सापेक्ष पथ का उपयोग कर सकते हैं; तो अपने उदाहरण में, कहें कि आप अपनी सीएसएस फ़ाइल ~/स्टाइल/mystyles.css में डालते हैं। आप उदाहरण के रूप में url (../ images/Test.gif) का उपयोग कर सकते हैं।

+1

यह आपकी सहायता नहीं करता है जब आपका ऐप किसी वेबसाइट की बजाय वर्चुअल निर्देशिका में चलता है –

11

दुर्भाग्यवश फ़ायरफ़ॉक्स में एक बेवकूफ बग है ... पथ सीएसएस फ़ाइल की स्थिति के सापेक्ष होने के बजाय पृष्ठ के पथ से संबंधित हैं। जिसका अर्थ है कि यदि आपके पास पेड़ में विभिन्न स्थितियों में पृष्ठ हैं (जैसे रूट में Default.aspx और व्यू फ़ोल्डर में Information.aspx) तो रिश्तेदार पथ काम करने का कोई तरीका नहीं है। (आईई सीएसएस फ़ाइल के स्थान से संबंधित पथों को सही तरीके से हल करेगा।)

एकमात्र चीज जो मुझे मिल सकती है वह http://www.west-wind.com/weblog/posts/269.aspx पर यह टिप्पणी है, लेकिन ईमानदार होने के लिए, मैंने इसे अभी तक काम करने में कामयाब नहीं किया है। मैं क्या अगर मैं इस टिप्पणी को संपादित करेंगे:

पुन: रस ब्रूक्स ने ASP.Net पथ की भावना बनाना फरवरी 25, 2006 @ 8:43 बजे

कोई भी पूरी तरह से Brant के सवाल का जवाब सीएसएस फ़ाइल के अंदर छवि पथ के बारे में। मुझे जवाब मिल गया है। प्रश्न था, "हम सीएसएस फ़ाइल के अंदर एप्लिकेशन-रिश्तेदार छवि पथ का उपयोग कैसे करते हैं?" मैं बहुत लंबे समय से इस समस्या से निराश हूं, इसलिए मैंने पिछले 3 घंटों समाधान को हल करने में बिताया है।

समाधान जड़ आवेदन पथ ASPX पेज हैंडलर के माध्यम से अपने सीएसएस फ़ाइलों चलाने के लिए है, तो उत्पादन के लिए रास्तों में से प्रत्येक में सर्वर-साइड कोड का एक टुकड़ा का उपयोग करें। तैयार?

  1. वेब में जोड़ें।config:
<compilation debug="true"> 
<!-- Run CSS files through the ASPX handler so we can write code in them. --> 
<buildProviders> 
<add extension=".css" type="System.Web.Compilation.PageBuildProvider" /> 
</buildProviders> 
</compilation> 

<httpHandlers> 
<add path="*.css" verb="GET" type="System.Web.UI.PageHandlerFactory" validate="true" /> 
</httpHandlers> 
  1. अपने सीएसएस के अंदर, Request.ApplicationPath संपत्ति जहाँ भी एक रास्ता मौजूद है, इस तरह का उपयोग करें:

    #content { पृष्ठभूमि: यूआरएल (<% = अनुरोध। आवेदनपैथ %>/छवियों/bg_content.gif) दोहराना-वाई; }

  2. .NET "text/html" डिफ़ॉल्ट रूप से, फलस्वरूप, अपने नए सर्वर साइड सीएसएस पृष्ठों इस माइम प्रकार से सेवा कर रहे हैं की एक MIME प्रकार जो गैर IE का कारण बनता है के साथ ASPX पृष्ठों में कार्य करता है पर ब्राउज़र सीएसएस फ़ाइल को सही ढंग से नहीं पढ़ते हैं। हम को "टेक्स्ट/सीएसएस" होने के लिए ओवरराइड करने की आवश्यकता है। बस अपने सीएसएस फ़ाइल की पहली पंक्ति के रूप में इस पंक्ति जोड़ें:

    <%@ ContentType="text/css" %> 
    
+3

यह गलत है। फ़ायरफ़ॉक्स ने पृष्ठ के पथ से संबंधित सीएसएस पथों का कभी भी व्याख्या नहीं किया। – Graham

+5

यह उत्तर गलत है। कृपया http://stackoverflow.com/questions/940451/using-relative-url-in-css-file-what-location-is-it-relative-to/940475#940475 – justis

+0

मुझे पूरा यकीन है कि यह सही था समय (मुझे लगता है कि मुझे लगता है कि कुछ घंटों के लिए उस बग से लड़ना मुझे याद है)। यह अब गलत हो सकता है :) –

-4

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

मार्सेल के समाधान और परीक्षण और त्रुटि के संयोजन के बाद मैंने इसे काम करने के लिए समाप्त कर दिया। मैंने web.config में कोड डाला, मेरी सीएसएस फ़ाइल में टेक्स्ट/सीएसएस लाइन डाली लेकिन मैंने सीएसएस फ़ाइल में पृष्ठभूमि संपत्ति को पूरी तरह से हटा दिया और इसे एएसपीएक्स पेज में सामग्री कंटेनर पर एक शैली के रूप में सेट किया, जिसे मैं पृष्ठभूमि चाहता था प्रदर्शन।

इसका मतलब यह है कि प्रत्येक या किसी अन्य पेज के लिए जो मैं पृष्ठभूमि प्रदर्शित करना चाहता हूं, मुझे शैली पृष्ठभूमि संपत्ति सेट करने की आवश्यकता होगी लेकिन यह खूबसूरती से काम करता है।

3

मार्सेल पोपेस्कू का समाधान सीएसएस फ़ाइल में Request.AplicationPath का उपयोग कर रहा है।

कभी भी अनुरोध का उपयोग नहीं करें। आवेदनपैथ - यह बुरा है! पथ के आधार पर विभिन्न परिणाम देता है!

इसके बजाए निम्नलिखित का उपयोग करें।

background-image: url(<%= Page.ResolveUrl("~/images/bg_content.gif") %>); 
+0

अन्य उत्तर पर टिप्पणी होनी चाहिए, लेकिन –

+0

पर ध्यान देने के लिए धन्यवाद कृपया इस पर कोई सहायता करें: http://stackoverflow.com/ प्रश्न/27274773/कैसे-टू-ऐड-इमेज-सोर्स-से-jquery-use-application-path – SearchForKnowledge

1

विंडोज 7 पर, 7.5 IIS:

न केवल आप चरणों मार्सेल पोपेस्कु द्वारा mentionned मुझे क्या करना होगा।

आपको आईआईएस 7.5 हैंडलर मैपिंग में एक हैंडलर मैपिंग भी जोड़ने की आवश्यकता है। ताकि आईआईएस जानता है कि * .css को System.Web.UI.PageHandlerFactory

के साथ उपयोग किया जाना चाहिए यह केवल web.config फ़ाइल में सामान सेट करने के लिए पर्याप्त नहीं है।

+0

बस हैंडलर नोड में system.web सर्वर के तहत, यह आपके लिए यह करेगा। – Darthtong

6

आपको जीवन आसान बनाते हैं, बस के साथ /css/ फ़ोल्डर में अपने सीएसएस में उपयोग की गई छवियां डालें। फिर जब आप अपनी छवियों का संदर्भ देते हैं, तो सापेक्ष पथ का उपयोग करें (उदा। url(images/image.jpg))।

मैं अभी भी /images/ फ़ोल्डर में <img> के साथ प्रदर्शित छवियों को रखता हूं। उदाहरण के लिए तस्वीरें सामग्री हैं, वे वेबसाइट की त्वचा/विषय का हिस्सा नहीं हैं। इस प्रकार, वे /css/ फ़ोल्डर में नहीं हैं।

+1

यह मदद नहीं करता है जब साइट को वर्चुअल निर्देशिका –

+2

में भी काम करना पड़ता है आप निर्देशिका को नीचे जाने के लिए सापेक्ष पथ का भी उपयोग कर सकते हैं। यदि आपके पास /images/image.jpg और /css/style.css है तो 'url (../ images/image.jpg)' सही ढंग से इसे लक्षित करेगा। –

+0

../ के साथ छवि पथ को उपसर्ग करने से यह कैसे आसान है? इस विकल्प में आम तौर पर अनुसरण किए गए विकास मानकों से मेल खाने का अतिरिक्त लाभ होता है। – Dan

3

अपने गतिशील सीएसएस को एक .ascx फ़ाइल में उपयोगकर्ता नियंत्रण में रखें और फिर आपको अपनी सभी सीएसएस फ़ाइलों को एएसपीनेट पेज प्रोसेसर के माध्यम से चलाने की आवश्यकता नहीं है।

<%@ Control %> 
<style type="text/css> 
div.content 
{ 
background-image:(url(<%= Page.ResolveUrl("~/images/image.png") %>); 
} 
</style> 

लेकिन ~ समस्या को हल करने का सबसे आसान तरीका बिल्कुल एक ~ का उपयोग नहीं करने के लिए है। विजुअल स्टूडियो में, समाधान एक्सप्लोरर में, अपने एप्लिकेशन पर राइट क्लिक करें, गुण विंडो का चयन करें और वर्चुअल पथ को / पर बदलें।

+0

इस पर कोई मदद कृपया: http://stackoverflow.com/questions/27274773/how-to-add-image-source-from-jquery-using-plication-path – SearchForKnowledge