background-attachment प्रॉपर्टी

background-attachment प्रॉपर्टी यह निर्धारित करती है कि एलिमेंट की बैकग्राउंड इमेज को कैसे स्क्रॉल किया जाए: टेक्स्ट के साथ या टेक्स्ट इमेज पर स्लाइड करेगा।

सिंटैक्स

cssसिलेक्टर {
  background-attachment: fixed | scroll | local;
}

वैल्यूज

डिफॉल्ट वैल्यू: scroll.

उदाहरण . scroll वैल्यू

अभी background-attachment प्रॉपर्टी scroll वैल्यू पर सेट है। एलिमेंट को वर्टिकली स्क्रॉल करें - आप देखेंगे कि टेक्स्ट बैकग्राउंड के साथ कैसे स्क्रॉल होता है:

html<body>
  <div id="elem">
    some long text
  </div>
</body>

cssbody {
  background-attachment: scroll;
  background-image: url("bg.png");
}

#elem {
  width: 400px;
  margin: 0 auto;
  text-align: justify;
  font-weight: bold;
  font-size: 20px;
}

Результат:

उदाहरण . fixed वैल्यू

अब background-attachment प्रॉपर्टी fixed वैल्यू पर सेट है। एलिमेंट को वर्टिकली स्क्रॉल करें - आप देखेंगे कि टेक्स्ट बैकग्राउंड पर कैसे स्लाइड करता है:

html<body>
  <div id="elem">
    some long text
  </div>
</body>

cssbody {
  background-attachment: fixed;
  background-image: url("bg.png");
}

#elem {
  width: 400px;
  margin: 0 auto;
  text-align: justify;
  font-weight: bold;
  font-size: 20px;
}

Результат:

यह भी देखें