CSS scroll-padding-right गुण

वर्णन और उपयोग

scroll-padding-right गुण से निर्दिष्ट होता है कि कंटेनर के दायाँ पार्श्व से सूचीबद्ध स्थान तक की दूरी。

सूचीबद्ध स्थान इस रूप में है, जब रोल रोल करना बंद करते हैं तो उप-एलिमेंट को कंटेनर में सूचीबद्ध स्थान पर ले जाया जाता है。

सूचीबद्ध स्थान द्वारा scroll-snap-align गुण विन्यास, लेकिन यह CSS गुण से भी प्रभावित हो सकता है direction और writing-mode वास्तविक प्रभाव।

ध्यान दें:此属性仅在吸附位置设置在子元素右侧时有效。

इस गुण को उप-तत्व के दायाँ तरफ से संबंधित स्थान पर सेट करना चाहिए। scroll-padding-right गुण के प्रभाव को देखने के लिए scroll-snap-align गुण के साथ-साथ scroll-padding-right और scroll-snap-type गुण

उदाहरण

उदाहरण 1

रोलिंग आंतरिक जगह को कंटेनर के दायाँ तरफ से संबंधित स्थान तक 20px के रूप में सेट करें:

div {
  scroll-padding-right: 20px;
}

खुद आयात्रा करें

उदाहरण 2: चित्र ग्राहक

scroll-padding-right गुण को उन चित्र गैलरी के लिए इस्तेमाल किया जा सकता है जिनके पास संबंधित क्रिया है, ताकि चित्र को नियत तत्व के पीछे से दिखाया जा सके:

#container > img {
  scroll-padding-right: 30px;
}

खुद आयात्रा करें

उदाहरण 3: दायाँ तरफ से रोलिंग आंतरिक जगह सेट करना

दोनों दिशाओं पर संबंधित क्रिया सेट करने पर, इसके साथ-साथ कंटेनर पर भी scroll-padding-right गुण को समझें: अगले तत्व तक आगे घुमाएं

#container > div {
  scroll-padding-right: 30px;
}

खुद आयात्रा करें

उदाहरण 4: संबंधित स्थान

करने के लिए scroll-padding-right गुण के लिए असर आएगा, संबंधित स्थान को उप-तत्व के दायाँ तरफ पर सेट करना चाहिए। इस उदाहरण मेंdirection गुण के मूल्य 'rtl' से संबंधित स्थान को उप-तत्व के दायाँ तरफ से बदलकर बाईं तरफ कर देगा।ऐसे कोड का इस्तेमाल करते हुएscroll-padding-right गुण को अब काम नहीं आएगा:

#container {
  direction: rtl;
  scroll-padding-right: 30px;
}
#container > div {
  scroll-snap-align: नहीं अंत|
}

खुद आयात्रा करें

सीएसएस व्याकरण

scroll-padding-right: ऑटो|मूल्य|इनिशियल|विरासत|;

गुण मूल्य

मूल्य वर्णन
ऑटो मूलभूत मूल्य
लंबाई

px, pt, cm आदि इकाइयों में scroll-padding-right को निर्दिष्ट करें。

नकारात्मक मूल्यों का इस्तेमाल नहीं किया जा सकता। देखें:सीएसएस इकाई。
% शामिल तत्व की चौड़ाई के प्रतिशत को आंतरिक जगह के रूप में निर्दिष्ट करें。
इनिशियल इस गुण को उसके मूलभूत मूल्य पर सेट करें। देखें: इनिशियल。
विरासत इस गुण को अपने पितृ तत्व से विरासत करें। देखें: विरासत。

तकनीकी विवरण

मूलभूत मूल्य: ऑटो
विरासतशीलता: नहीं
एनिमेशन निर्माण: समर्थन नहीं किया जाता। देखें:एनिमेशन से संबंधित गुण。
संस्करण: सीएसएस3
जेसक्रिप्ट व्याकरण: object.style.scrollPaddingRight="20px"

ब्राउज़र समर्थन

तालिका में दिए गए नंबर इस गुण को पूरी तरह से समर्थन देने वाले पहले ब्राउज़र के संस्करण को प्रदर्शित करते हैं。

च्रोम एज फायरफॉक्स सैफारी ओपेरा
69.0 79.0 68.0 14.1 56.0

संबंधित पृष्ठ

सन्दर्भ：CSS दिशा गुण

सन्दर्भ：CSS scroll-snap-align गुण

सन्दर्भ：CSS scroll-snap-type गुण

सन्दर्भ：CSS रिटिंग-मोड प्रभाव