style backgroundRepeat प्रॉपर्टी का उपयोग यह सेट या प्राप्त करने के लिए किया जाता है कि पृष्ठभूमि छवि खुद को कैसे दोहराती है।
सिंटैक्स
backgroundRepeat प्रॉपर्टी सेट करने के लिए सिंटैक्स निम्नलिखित है:
object.style.backgroundRepeat = "repeat|repeat-x|repeat-y|no-repeat|initial|inherit"
मान
उपरोक्त प्रॉपर्टी मान निम्नलिखित हैं:
| क्रमांक | मान एवं विवरण |
|---|---|
| 1 | repeat यह डिफ़ॉल्ट मान है। यह पृष्ठभूमि छवि को लंबवत और क्षैतिज दोनों रूप से दोहराता है। |
| 2 | repeat-x यह पृष्ठभूमि छवि को केवल क्षैतिज रूप से दोहराता है। |
| 3 | repeat-y यह पृष्ठभूमि छवि को केवल लंबवत रूप से दोहराता है। |
| 4 | no-repeat पृष्ठभूमि छवि को नहीं दोहराता। |
उदाहरण
backgroundRepeat प्रॉपर्टी का एक उदाहरण देखते हैं:
<!DOCTYPE html> <html> <head> <style> body { background-image: url("https://www.tutorialspoint.com/power_bi/images/power-bi-minilogo.jpg"); background-repeat: repeat-x; color:black; font-size:20px; } </style> <script> function changeBackRepeat(){ document.body.style.backgroundRepeat="repeat-y"; document.getElementById("Sample").innerHTML="The background image is now repeated vertically"; } </script> </head> <body> <h2>Demo Heading</h2> <p>This is demo text.</p> <p>This is demo text.</p> <p>This is demo text.</p> <p>This is demo text.</p> <p>Change the body background image repeat value by clicking the below button</p> <button onclick="changeBackRepeat()">CHANGE REPEAT</button> <p id="Sample"></p> </body> </html>
आउटपुट
यह निम्नलिखित आउटपुट उत्पन्न करेगा:
CHANGE REPEAT बटन पर क्लिक करने पर:
