तत्वों की पृष्ठभूमि शैली के लिए, आप पृष्ठभूमि छवि, पृष्ठभूमि स्थिति सेट कर सकते हैं। इसके साथ, छवि को क्षैतिज या लंबवत रूप से दोहराने के लिए बैकग्राउंड रिपीट भी सेट करें।
पृष्ठभूमि-स्थिति
बैकग्राउंड पोजीशन एक बैकग्राउंड इमेज की शुरुआती पोजीशन सेट करने के लिए है। इसके लिए बैकग्राउंड-पोजिशन प्रॉपर्टी का इस्तेमाल करें।
उदाहरण
आइए अब एक उदाहरण देखें -
<!DOCTYPE html>
<html>
<head>
<style>
body {
background-image: url("https://www.tutorialspoint.com/images/Swift.png");
background-repeat: no-repeat;
background-attachment: fixed;
color: blue;
background-position: left center;
}
.demo {
text-decoration: overline underline;
}
</style>
</head>
<body>
<h1>Details</h1>
<p class="demo">Examination Center near ABC College.</p>
<p class="demo2">Exam begins at 9AM.</p>
</body>
</html> आउटपुट
बैकग्राउंड-रिपीट
CSS में बैकग्राउंड रिपीट का उपयोग यह सेट करने के लिए किया जाता है कि वेब पेज पर बैकग्राउंड इमेज कैसे दोहराई जाती है। इसके लिए बैकग्राउंड-रिपीट प्रॉपर्टी का इस्तेमाल करें। निम्नलिखित गुण मान हो सकते हैं -
background-repeat: repeat|repeat-x|repeat-y|no-repeat|initial|inherit;
उदाहरण
आइए अब एक उदाहरण देखें -
<!DOCTYPE html>
<html>
<head>
<style>
body {
background-image: url("https://www.tutorialspoint.com/images/Swift.png");
background-repeat: repeat-x;
background-color: blue;
color: white;
}
.demo {
text-decoration: overline underline;
}
</style>
</head>
<body>
<h1>Details</h1>
<p class="demo">Examination Center near ABC College.</p>
<p class="demo2">Exam begins at 9AM.</p>
</body>
</html> आउटपुट
