सीएसएस पृष्ठभूमि-छवि - सही उपयोग क्या है?

Question

CSS बैकग्राउंड-इमेज प्रॉपर्टी का सही उपयोग क्या है? जिन प्रमुख बातों को मैं समझने की कोशिश कर रहा हूं, वह है

1. क्या यह उद्धरण में होने की आवश्यकता है अर्थात: background-image: url('images/slides/background.jpg');
2. क्या यह एक सापेक्ष पथ हो सकता है (ऊपर के रूप में) या क्या यह पूर्ण URL होना चाहिए?
3. किसी भी अन्य बिंदु पर मुझे यह सुनिश्चित करने के लिए जागरूक होना चाहिए कि यह मानकों के अनुरूप ब्राउज़रों में सही ढंग से काम करता है।

Comments

यह भी देखें stackoverflow.com/questions/2168855/css-url-whats-better

— harpo

बस एक नोट: नेटबीन्स 7 में यदि आप url () के अंदर का रास्ता नहीं छोड़ते हैं, तो आपको एक चेतावनी मिलेगी "अप्रत्याशित मान टोकन url" यदि आप सिंगल या डबल कोट्स में पथ डालेंगे, तो अलर्ट गायब हो जाएगा।

— कांटे ११'१२

यह 7.3 में तय किया गया है। netbeans.org/bugzilla/show_bug.cgi?id=209067

— caiosm1005

उद्धरणों के लिए, देखें url () का मूल्य उद्धृत करना वास्तव में आवश्यक है?

— 15

Answer 1

रास्ता या तो पूर्ण या रिश्तेदार हो सकता है (यदि छवि किसी अन्य डोमेन से है तो यह पूर्ण होना चाहिए)।

आपको URI में उद्धरण का उपयोग करने की आवश्यकता नहीं है; वाक्यविन्यास या तो हो सकता है:

background-image: url(image.jpg);

या

background-image: url("image.jpg");

हालांकि, W3 से :

कुछ अक्षर URI में दिखाई देने वाले चरित्र, जैसे कि कोष्ठक, श्वेत स्थान वर्ण, एकल उद्धरण (') और दोहरे उद्धरण ("), को बैकस्लैश से बचना चाहिए ताकि परिणामस्वरूप URI मान एक URI टोकन हो:' \ '(') '\)'।

इसलिए ऐसे उदाहरणों में, या तो उद्धरण या दोहरे उद्धरण चिह्नों का उपयोग करना आवश्यक है, या पात्रों से बच सकते हैं।

Answer 2

1. नहीं, आपको उद्धरण की आवश्यकता नहीं है।

2. हाँ तुम कर सकते हो। लेकिन ध्यान दें कि रिश्तेदार URL आपके स्टाइलशीट के URL से हल किए जाते हैं।

3. बेहतर उद्धरण का उपयोग न करें। मुझे लगता है कि ऐसे ग्राहक हैं जो उन्हें नहीं समझते हैं।

Answer 3

1) उद्धरण देना एक अच्छी आदत है

2) यह उदाहरण के लिए सापेक्ष पथ हो सकता है:

background-image: url('images/slides/background.jpg');

उस फ़ोल्डर में चित्र फ़ोल्डर की तलाश करेगा जिसमें से css लोड किया गया है। इसलिए यदि छवियां किसी अन्य फ़ोल्डर में हैं या CSS फ़ोल्डर ट्री से बाहर हैं, तो आपको रूट पथ के सापेक्ष निरपेक्ष पथ या रिश्तेदार का उपयोग करना चाहिए (इसके साथ शुरू / /)

3) आपको पृष्ठभूमि-छवि के लिए पूर्ण घोषणा का उपयोग करना चाहिए ताकि यह मानकों के अनुरूप ब्राउज़रों में लगातार व्यवहार कर सके जैसे:

background:blue url('/images/clouds.jpg') no-repeat scroll left center;

Comments

क्या आपको backgroundइसके बजाय मतलब नहीं है background-image?

— गुम्बो

क्योंकि कभी-कभी आपके पास छवि नाम या पथ नाम में स्थान होता है और यह समस्या का कारण हो सकता है।

— विलेजइडियोडॉट

@ TheVillageIdiot अभी भी तीसरी पंक्ति में नहीं है, background-imageजैसा कि background@Gumbo द्वारा सुझाया जाना चाहिए

— KNU

Answer 4

रिश्तेदार रास्ते ठीक हैं और उद्धरण आवश्यक नहीं हैं। backgroundछवि को लोड नहीं करने या किसी कारण से उपलब्ध नहीं होने की स्थिति में पृष्ठभूमि रंग को निर्दिष्ट करने के लिए "शॉर्टहैंड" संपत्ति का उपयोग करने में मदद करने वाली एक और चीज़ है ।

#elementID {
    background: #000 url(images/slides/background.jpg) repeat-x top left;
}

यह भी ध्यान दें कि आप निर्दिष्ट कर सकते हैं कि क्या छवि दोहराएगी और किस दिशा में (यदि आप निर्दिष्ट नहीं करते हैं, तो डिफ़ॉल्ट को क्षैतिज और लंबवत रूप से दोहराना है), और इसके कंटेनर के सापेक्ष छवि का स्थान भी।

Answer 5

यदि आपकी छवियां आपकी सीएसएस फ़ाइल की एक अलग निर्देशिका में हैं और आप चाहते हैं कि आपके वेब साइट की जड़ से सापेक्ष पथ शुरू हो जाए:

background-image: url('/Images/bgi.png');

Comments

मैं नहीं खोज रहा था कि क्या मैं एक रिश्तेदार पथ का उपयोग कर सकता हूं ... मैं खोज रहा था कि किसी रिश्तेदार पथ का उपयोग कैसे किया जाए ... +1 यह स्पष्ट करने के लिए कि रास्ता कहां से शुरू होता है।

— me_

Answer 6

बस डायरेक्टरी स्ट्रक्चर को चेक करें जहाँ बिलकुल इमेज है मान लीजिए कि आपके पास css फोल्डर है और css फोल्डर के बाहर इमेज फोल्डर है तो आपको "../ images / image.jpg" का उपयोग करना होगा और यह काम करेगा क्योंकि यह मेरे लिए किया था बस सुनिश्चित करें डायरेक्टरी स्टैचर।

Answer 7

अगर आपको यह कहने की ज़रूरत है कि आपके सीएसएस फ़ाइल से छवि का उपयोग कर रहे हैं तो यह उद्धरण की आवश्यकता नहीं है

{background-image: url(your image.png/jpg etc);}

Answer 8

आपको उद्धरण चिह्नों का उपयोग करने की आवश्यकता नहीं है और आप अपनी पसंद के किसी भी पथ का उपयोग कर सकते हैं!

Answer 9

पृष्ठभूमि-छवि और यूआरआई के लिए संबंधित साइट पॉइंट संदर्भ पृष्ठों पर एक नज़र डालें

1. यह उद्धरण में होने की जरूरत नहीं है, लेकिन यदि आप चाहें तो उनका उपयोग कर सकते हैं। (मुझे लगता है कि IE5 / Mac एकल उद्धरण का समर्थन नहीं करता है)।
2. रिश्तेदार और पूर्ण दोनों संभव है; एक रिश्तेदार पथ सीएसएस फ़ाइल के पथ के सापेक्ष है।

Answer 10

बस bss की तरह अपने css फ़ाइल में लिखें

background:url("images/logo.jpg")