शैली पृष्ठभूमि संपत्ति
उदाहरण
किसी दस्तावेज़ की पृष्ठभूमि को स्टाइल करें:
document.body.style.background = "#f3f3f3 url('img_tree.png') no-repeat right
top";
नीचे और अधिक "इसे स्वयं आज़माएं" उदाहरण।
परिभाषा और उपयोग
बैकग्राउंड प्रॉपर्टी शॉर्टहैंड फॉर्म में आठ अलग-अलग बैकग्राउंड प्रॉपर्टी सेट या रिटर्न करती है।
इस संपत्ति के साथ, आप निम्न में से एक या अधिक (किसी भी क्रम में) सेट/वापस कर सकते हैं:
- पृष्ठभूमि का रंग
- पृष्ठभूमि छवि
- पृष्ठभूमि दोहराएँ
- पृष्ठभूमि संलग्न
- पृष्ठभूमि स्थिति
- पृष्ठभूमि-आकार
- पृष्ठभूमि मूल के
- पृष्ठभूमि-क्लिप
उपरोक्त गुणों को अलग शैली गुणों के साथ भी सेट किया जा सकता है। बेहतर नियंत्रणीयता के लिए गैर-उन्नत लेखकों के लिए अलग-अलग गुणों के उपयोग की अत्यधिक अनुशंसा की जाती है।
ब्राउज़र समर्थन
तालिका में संख्याएं पहले ब्राउज़र संस्करण को निर्दिष्ट करती हैं जो पूरी तरह से संपत्ति का समर्थन करता है।
Property | |||||
---|---|---|---|---|---|
background | 1.0 | 4.0 | 1.0 | 1.0 | 3.5 |
नोट: नीचे प्रत्येक मान के लिए अलग-अलग ब्राउज़र समर्थन देखें।
वाक्य - विन्यास
पृष्ठभूमि संपत्ति वापस करें:
object.style.background
पृष्ठभूमि संपत्ति सेट करें:
object.style.background = "color image
repeat attachment position size origin clip|initial|inherit"
सम्पत्ति की कीमत
Value | Description |
---|---|
color | Sets the background color of an element |
image | Sets the background image for an element |
repeat | Sets how a background image will be repeated |
attachment | Sets whether a background image is fixed or scrolls with the page |
position | Sets the starting position of a background image |
size | Sets the size of a background image |
origin | Sets the background positioning area |
clip | Sets the painting area of a background image |
initial | Sets this property to its default value. Read about initial |
inherit | Inherits this property from its parent element. Read about inherit |
टेक्निकल डिटेल
डिफ़ॉल्ट मान: | पारदर्शी कोई नहीं दोहराना स्क्रॉल 0% 0% ऑटो पैडिंग-बॉक्स बॉर्डर-बॉक्स |
---|---|
प्रतिलाभ की मात्रा: | एक स्ट्रिंग, एक तत्व की पृष्ठभूमि का प्रतिनिधित्व करता है |
सीएसएस संस्करण | CSS1 + CSS3 में नए गुण |
और ज्यादा उदाहरण
उदाहरण
एक डीआईवी तत्व की पृष्ठभूमि बदलें:
document.getElementById("myDIV").style.background = "url('smiley.gif') blue repeat-x center";
उदाहरण
किसी दस्तावेज़ के लिए पृष्ठभूमि का रंग सेट करें:
document.body.style.backgroundColor = "red";
उदाहरण
किसी दस्तावेज़ के लिए पृष्ठभूमि छवि सेट करें:
document.body.style.backgroundImage = "url('img_tree.png')";
उदाहरण
बैकग्राउंड-इमेज को नो-रिपीट पर सेट करें:
document.body.style.backgroundRepeat = "repeat-y";
उदाहरण
पृष्ठभूमि-छवि को ठीक करने के लिए सेट करें (स्क्रॉल नहीं होगा):
document.body.style.backgroundAttachment = "fixed";
उदाहरण
पृष्ठभूमि-छवि की स्थिति बदलें:
document.body.style.backgroundPosition = "top right";
उदाहरण
किसी दस्तावेज़ के पृष्ठभूमि गुण मान लौटाएँ:
document.body.style.background;
संबंधित पृष्ठ
सीएसएस ट्यूटोरियल: सीएसएस पृष्ठभूमि
CSS3 ट्यूटोरियल: CSS3 पृष्ठभूमि
सीएसएस संदर्भ: पृष्ठभूमि संपत्ति