HTML में URL के src पथ में एक स्तर ऊपर जाने के लिए कैसे?


101

मैं शैली पत्रक को {रूट} / शैलियों में संग्रहीत कर रहा हूं जबकि छवियों को {रूट} / छवियों को किसी वेबसाइट के लिए। मैं निर्दिष्ट छवियों के लिए चित्र निर्देशिका में देखने के लिए शैली पत्रक में पथ कैसे दे सकता हूं?

जैसे में background-image: url('/images/bg.png');

जवाबों:


184

..मूल निर्देशिका को इंगित करने के लिए उपयोग करें :

background-image: url('../images/bg.png');

मैंने पढ़ा है कि कहीं और- लेकिन यह काम नहीं करता है! (कम से कम क्रोम में)
aateeque

27
ऐसा होता है। हालांकि ध्यान दें कि स्थान CSS फ़ाइल के स्थान के सापेक्ष है, न कि CSS फ़ाइल को एम्बेड करने वाला दस्तावेज़।
ThiefMaster

1
@ThiefMaster यह होना चाहिए अगर हम
1000Gbps

57

यहां आपको रिश्तेदार फ़ाइल पथों के बारे में जानना होगा:

  • /रूट निर्देशिका में रिटर्न के साथ शुरू होता है और वहां शुरू होता है

  • के साथ शुरू ../ चाल एक निर्देशिका पिछड़े और शुरू होता है वहाँ

  • के साथ शुरू ../../ चाल दो निर्देशिका पिछड़े और शुरू होता है वहाँ (और इतने पर ...)

  • आगे बढ़ने के लिए , बस पहले उप निर्देशिका से शुरू करें और आगे बढ़ते रहें।

अधिक जानकारी के लिए यहाँ क्लिक करें !


52

उपयोग करें ../:

background-image: url('../images/bg.png');

आप जितनी बार चाहें उतनी बार उपयोग कर सकते हैं, उदाहरण के लिए ../../images/या विभिन्न पदों पर भी, उदाहरण के लिए ../images/../images/../images/( ../images/पाठ्यक्रम के अनुसार)


9

Chrome में जब आप कुछ HTTP सर्वर से किसी वेबसाइट को पूर्ण पथ (जैसे /images/sth.png) और कुछ ऊपरी स्तर निर्देशिका (जैसे ../images/sth.png) कार्य के सापेक्ष पथ से लोड करते हैं।

परंतु!

जब आप (Chrome में!) लोकल फाइल सिस्टम से एक HTML डॉक्यूमेंट लोड करते हैं, तो आप डायरेक्ट्री को डायरेक्ट डायरेक्टरी से ऊपर नहीं ले जा सकते। यानी आप ../something/something.sthसापेक्ष पथ को पूर्ण या किसी अन्य चीज़ तक नहीं पहुंचा सकते हैं और न ही बदल पाएंगे।


1
रीचेक करने पर, मैं रिपोर्ट कर सकता हूं कि स्थानीय फ़ाइल सिस्टम रिश्तेदार-पथ का उपयोग ../ठीक काम करता है - या कम से कम इस विशिष्ट मामले में ठीक काम करता है!
23

1
यह linux और windows पर काम करता है, मैक पर नहीं (मेरा अनुभव)
gabn88

लिंक की यहां गिनती नहीं है, क्योंकि उनके लिए एक ही मूल जांच नहीं है। साथ ही यह जवाब 6 साल पुराना है इसलिए ब्राउज़र बहुत बदल गए होंगे।
जाबोजा

1
मैं जवाब देखने वाले किसी और के लिए सिर्फ पुष्टि कर रहा हूं
अजय

0

मान लें कि आपके पास निम्न फ़ाइल संरचना है:

-css
  --index.css
-images
  --image1.png
  --image2.png
  --image3.png

CSS में आप image1उदाहरण के लिए, लाइन का उपयोग कर सकते हैं ../images/image1.png

नोट : यदि आप Chrome का उपयोग कर रहे हैं, तो यह काम नहीं कर सकता है और आपको एक त्रुटि मिलेगी कि फ़ाइल नहीं मिल सकती है। मुझे एक ही समस्या थी, इसलिए मैंने क्रोम से पूरे कैश इतिहास को हटा दिया और यह काम कर गया।


0

यदि आप किसी फ़ोल्डर में स्टाइलशीट / चित्र संग्रहीत करते हैं, ताकि कई वेबसाइटें उनका उपयोग कर सकें, या आप उसी सर्वर पर किसी अन्य साइट पर उन्हीं फ़ाइलों का फिर से उपयोग करना चाहते हैं, तो मैंने पाया है कि मेरा ब्राउज़र / अपाचे मुझे अंदर जाने की अनुमति नहीं देता है। वेबसाइट रूट URL के ऊपर कोई भी मूल फ़ोल्डर। यह सुरक्षा कारणों से स्पष्ट लगता है - किसी निर्दिष्ट वेब फ़ोल्डर के अलावा किसी भी जगह सर्वर पर ब्राउज़ करने में सक्षम नहीं होना चाहिए।

उदाहरण के लिए। काम नहीं करता है: www.mywebsite.com/../images

वर्कअराउंड के रूप में, मैं साइमलिंक का उपयोग करता हूं:

Www.mywebsite.com की निर्देशिका पर जाएं कमांड ln -s ../images चित्र चलाएँ

अब www.mywebsite.com/images www.mywebsite.com/../images को इंगित करेगा

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.