बैकग्राउंड स्टाइलिंग
एलिमेंट्स के बैकग्राउंड को स्टाइल करने के लिए, आप बैकग्राउंड इमेज, बैकग्राउंड पोजीशन सेट कर सकते हैं। साथ ही, बैकग्राउंड रिपीट से इमेज को क्षैतिज या लंबवत रूप से दोहरा सकते हैं।
background-position
बैकग्राउंड इमेज की शुरुआती पोजीशन सेट करने के लिए background-position प्रॉपर्टी का उपयोग करें।
उदाहरण
<!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>
आउटपुट
background-repeat
बैकग्राउंड इमेज कैसे दोहराई जाती है, यह सेट करने के लिए background-repeat प्रॉपर्टी का उपयोग करें।
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>
आउटपुट
