सीएसएस बैकग्राउंड-पोजिशन एट्रिब्यूट
- पिछला पृष्ठ बैकग्राउंड-ओरिजिन
- अगला पृष्ठ बैकग्राउंड-पोजिशन-एक्स
डिफ़ाइनिशन और उपयोग
background-position गुण पृष्ठभूमि चित्र के शुरूआती स्थान को सेट करता है。
यह गुण पृष्ठभूमि मूल चित्र को सेट करता है (द्वारा background-image डिफ़ाइनिशन) के स्थान पर, यदि पृष्ठभूमि चित्र को दोहराना है, तो इस बिंदु से शुरू होगा。
सूचना:आपको background-attachment गुण को "स्थिर“, ताकि यह गुण Firefox और Opera में सही तरीके से काम करे।
अन्य संदर्भ:
CSS शिक्षा:CSS पृष्ठभूमि
CSS संदर्भ दस्तावेज़:background-image गुण
HTML DOM संदर्भ दस्तावेज़:backgroundPosition गुण
उदाहरण
कैसे बैकग्राउंड इमेज को स्थानांतरित किया जाता है:
बॉडी
{
background-image:url('bgimage.gif');
background-repeat:no-repeat;
background-attachment:fixed;
background-position:center;
}
CSS ग्रामातर
background-position: मान;
गुण-मान
| मान | वर्णन |
|---|---|
|
यदि आपको केवल एक शब्द दिया गया है, तो दूसरा मान "center" होगा。 मूलभूत मान: 0% 0%。 |
| x% y% |
पहला मान स्तरांतरण के लिए है, दूसरा मान ऊर्ध्व स्थानांतरण के लिए है。 बाएँ ऊपरी कोना 0% 0% है। दाएँ नीचे कोना 100% 100% है。 यदि आपको केवल एक मान दिया गया है, तो दूसरा मान 50% होगा。 |
| xpos ypos |
पहला मान स्तरांतरण के लिए है, दूसरा मान ऊर्ध्व स्थानांतरण के लिए है。 बाएँ ऊपरी कोना 0 0 है। इकाई पिक्सल (0px 0px) या किसी अन्य CSS इकाई है。 यदि आपको केवल एक मान दिया गया है, तो दूसरा मान 50% होगा。 आप % और position मानों को मिलाकर उपयोग कर सकते हैं。 |
तकनीकी विवरण
| मूलभूत मान: | 0% 0% |
|---|---|
| विरासत की अधिकारिता: | नहीं |
| संस्करण: | CSS1 |
| जेसक्रिप्ट ग्रामातर | ऑब्जेक्ट.style.backgroundPosition="center" |
अधिक उदाहरण
- कैसे प्रतिशत% का उपयोग करके बैकग्राउंड इमेज को स्थानांतरित किया जाता है
- इस उदाहरण में देखा जाता है कि कैसे प्रतिशत का उपयोग करके पृष्ठ पर बैकग्राउंड इमेज को स्थानांतरित किया जाता है。
- कैसे पिक्सल का उपयोग करके बैकग्राउंड इमेज को स्थानांतरित किया जाता है
- इस उदाहरण में देखा जाता है कि कैसे पिक्सल का उपयोग करके पृष्ठ पर बैकग्राउंड इमेज को स्थानांतरित किया जाता है。
ब्राउज़र समर्थन
तालिका में दिए गए नंबरों में पूर्ण समर्थन प्राप्त करने वाले पहले ब्राउज़र का संस्करण उल्लेख किया गया है。
| च्रोम | एज | फायरफॉक्स | सैफारी | ओपेरा |
|---|---|---|---|---|
| च्रोम | आईई / एज | फायरफॉक्स | सैफारी | ओपेरा |
| 1.0 | 4.0 | 1.0 | 1.0 | 3.5 |
- पिछला पृष्ठ बैकग्राउंड-ओरिजिन
- अगला पृष्ठ बैकग्राउंड-पोजिशन-एक्स
