Computer >> कंप्यूटर ट्यूटोरियल >  >> प्रोग्रामिंग >> JavaScript

CSS में पृष्ठभूमि छवि के स्क्रॉलिंग को नियंत्रित करने के लिए कौन सा गुण उपयोग किया जाता है?

पृष्ठभूमि में छवि के स्क्रॉलिंग को सेट करने के लिए, background-attachment गुण का उपयोग करें।

उदाहरण

निम्न कोड चलाकर देखें कि background-attachment गुण कैसे काम करता है:

<!DOCTYPE html> <html>
  <head>
    <style>
      body {
        background-image: url('/css/images/css.jpg');
        background-repeat: no-repeat;
        background-attachment: fixed;
        background-attachment: scroll;
      }
    </style>
  </head>
  <body>
    <p>The background-image is fixed. Try to scroll down the page.</p>
    <p>The background-image is fixed. Try to scroll down the page.</p>
    <p>The background-image is fixed. Try to scroll down the page.</p>
    <p>The background-image is fixed. Try to scroll down the page.</p>
    <p>The background-image is fixed. Try to scroll down the page.</p>
    <p>The background-image is fixed. Try to scroll down the page.</p>
    <p>The background-image is fixed. Try to scroll down the page.</p>
    <p>The background-image is fixed. Try to scroll down the page.</p>
  </body>
</html>

नोट: उदाहरण में background-attachment दो बार घोषित किया गया है; अंतिम मान (scroll) प्रभावी होगा। fixed मान छवि को व्यूपोर्ट के सापेक्ष स्थिर रखता है, जबकि scroll (डिफ़ॉल्ट) इसे सामग्री के साथ स्क्रॉल करता है।

  1. - CSS के साथ रेडियल ग्रेडिएंट को पृष्ठभूमि छवि के रूप में सेट करें

    radial-gradient() CSS फ़ंक्शन का उपयोग करके रेडियल ग्रेडिएंट को पृष्ठभूमि छवि के रूप में सेट करें। यह फ़ंक्शन एक केंद्र बिंदु से बाहर की ओर फैलने वाला ग्रेडिएंट बनाता है। उदाहरण <!DOCTYPE html> <html> <head> <style> #demo { height: 200px; back

  1. CSS में Background शॉर्टहैंड प्रॉपर्टी CSS में Background शॉर्टहैंड प्रॉपर्टी

    CSS background शॉर्टहैंड प्रॉपर्टी का उपयोग किसी एलिमेंट के लिए बैकग्राउंड को परिभाषित करने के लिए किया जाता है। background-color, background-image, background-repeat, background-position, background-clip, background-size, background-origin और background-attachment मिलकर CSS background प्रॉपर्टीज बन

  1. CSS से बैकग्राउंड इमेज सेट करना CSS से बैकग्राउंड इमेज सेट करना

    CSS background-image प्रॉपर्टी का उपयोग चयनित एलिमेंट के लिए एक इमेज को बैकग्राउंड के रूप में सेट करने के लिए किया जाता है। सिंटैक्स CSS background-image प्रॉपर्टी का सिंटैक्स निम्नलिखित है: Selector {    background-image: /*value*/ } निम्नलिखित उदाहरण CSS background-image प्रॉपर्टी को द