CSS स्क्रॉल-मार्जिन-ब्लॉक-स्टार्ट प्रकृति

परिभाषा और उपयोग

scroll-margin-block-start गुण ब्लॉक दिशा पर एडसिंग की स्थिति और कंटेनर के बीच की दूरी निर्धारित करता है。

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

ब्लॉक दिशा यह है कि अगली पंक्ति के साथ वर्तमान पंक्ति के अनुसार की जगह पर रखे जाने वाले दिशा, यह भी जो CSS display: block; वाले टैग (जैसे <p> और <div> टैग) पृष्ठ पर देखाई देते हैं, इसका बैठाया जाता है। ब्लॉक दिशा लिखने वाली भाषा पर निर्भर करती है, जैसे कि मंगोलियन के नए पंक्ति दाएँ से बाएँ की ओर जाते हैं, इसलिए ब्लॉक दिशा दाएँ से बाएँ की ओर है, जबकि अंग्रेजी पृष्ठ की ब्लॉक दिशा नीचे की ओर है। ब्लॉक दिशा CSS गुण के द्वारा निर्धारित की जाती है writing-mode 定义。

परिभाषित।

जब आप स्क्रॉल को रुकावट लगाते हैं तो, उप-तत्व कंटेनर में लटकने वाली स्थिति को लटकने वाला स्थान कहते हैं。ध्यान दें: scroll-snap-align इस गुण के प्रभाव को देखने के लिए यह गुण केवल ब्लॉक दिशा में

गुण को 'start' पर सेट करना चाहिए। scroll-margin-block-start गुण के प्रभाव को देखने के लिए, उप-तत्व पर scroll-margin-block-start और scroll-snap-align गुण को, और पितृ तत्व पर scroll-snap-type गुण

CSS के scroll-margin-inline और scroll-margin-block गुण CSS गुण CSS scroll-margin-top गुणऔरscroll-margin-bottomऔरscroll-margin-left और scroll-margin-right बहुत अधिक अभिज्ञता के समान है, लेकिन scroll-margin-block और scroll-margin-inline गुण ब्लॉक दिशा और इनलाइन दिशा पर निर्भर करता है。

उदाहरण

उदाहरण 1

ब्लॉक दिशा में, अनुक्रम स्थान को कंटेनर से दूरी 20px पर सेट करें:

div {
  scroll-margin-block-start: 20px;
}

अपने आप सिर्फ आया

उदाहरण 2

जब <div> तत्व का writing-mode गुण को vertical-rl पर सेट करने पर ब्लॉक दिशा दांव-बाईं दिशा होती है। परिणामस्वरूप एलिमेंट का शुरूआती हिस्सा ऊपर से दांव की ओर जाता है:

div {
  scroll-margin-block-start: 50px;
  writing-mode: vertical-rl;
}

अपने आप सिर्फ आया

CSS व्याकरण

scroll-margin-block-start: 0|value|initial|inherit;

गुण मान

मान वर्णन
0 डिफ़ॉल्ट। एलिमेंट की डिफ़ॉल्ट scroll-margin दूरी
length

px, pt, cm आदि इकाइनों से दूरी निर्दिष्ट करने के लिए निर्दिष्ट कीजिए। नकारात्मक मान की अनुमति है।

देखें:सीएसएस इकाई

initial इस गुण को उसके डिफ़ॉल्ट वैल्यू पर सेट करें। देखें initial
inherit अपने पितृ तत्व से इस गुण को विरासत करें। देखें inherit

तकनीकी विवरण

डिफ़ॉल्ट वैल्यू: 0
विरासतीयता: नहीं
एनीमेशन निर्माण: समर्थन नहीं है। देखें:एनीमेशन संबंधी गुण
संस्करण: CSS3
जेसक्रिप्ट व्याकरण: object.style.scrollMarginBlockStart="20px"

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

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

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

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

संदर्भ:CSS scroll-snap-align गुण

संदर्भ:CSS scroll-snap-type गुण

संदर्भ:CSS राइटिंग-मोड प्रतियोगिता