CSS స్క్రోల్-మార్జిన్-లెఫ్ట్ అట్రిబ్యూట్

నిర్వచనం మరియు ఉపయోగం

scroll-margin-left 属性指定吸附位置与容器之间的距离。

吸附位置是指子元素在停止滚动时，其在容器中固定到位的位置。吸附位置通过 scroll-snap-align 属性设置，但也可能受到 CSS 属性 direction 和 writing-mode 的影响。

注意：此属性仅在吸附位置设置在子元素的左侧时才有效。

要看到 scroll-margin-left 属性的效果，必须在子元素上设置 scroll-margin-left 和 scroll-snap-align 属性，并在父元素上设置 scroll-snap-type లక్షణం

ఉదాహరణ

ఉదాహరణ 1

పరిధి స్థానం మరియు కంటైనర్ మధ్య స్క్రాల్ బాహ్య మార్జిన్ 20px గా అమర్చండి:

div {
  scroll-margin-left: 20px;
}

స్వయంగా ప్రయత్నించండి

ఉదాహరణ 2: చిత్రాల కొలక్షన్

scroll-margin-left పరిధి ప్రభావం ఉన్న చిత్రాల గ్యాలరీలో ఈ లక్షణం ఉపయోగించబడవచ్చు. ఇక్కడ ఈ ప్రకారం ఉంటుంది:scroll-margin-left వినియోగదారులకు ఎడమ వైపు మరొక చిత్రం ఉన్నది తెలియజేయండి. మొదటి చిత్రం పైన స్క్రాల్ చేసి ప్రభావాన్ని చూడండి:

#container > img {
  scroll-margin-left: 30px;
}

స్వయంగా ప్రయత్నించండి

ఉదాహరణ 3: పరిధి స్థానం

ఈ ఉదాహరణలో ఈ ప్రకారం ఉంటుంది: scroll-margin-left ఈ లక్షణం ప్రభావం ఉంటుంది, అందువలన పరిధిని పిల్ల ఉపఘటకం ఎడమ వైపుకు అమర్చాలి. ఈ ఉదాహరణలో ఈ ప్రకారం ఉంటుంది:direction ఈ లక్షణం పరిధిని పిల్ల ఉపఘటకం ఎడమ వైపు నుండి కుడి వైపుకు మార్చింది. ఈ ప్రకారం కోడ్ ఉపయోగించినప్పుడు ఈ లక్షణం ప్రభావం ఉంటుంది:scroll-margin-left ఈ లక్షణం ఇకపై ప్రభావితం కాదు:

#container {
  direction: rtl;
}
#container > div {
  scroll-margin-left: 30px;
  scroll-snap-align: none start;
}

స్వయంగా ప్రయత్నించండి

సిఎస్ఎస్ సంకేతాలు

scroll-margin-left: 0|విలువ|ఇనిశియల్|ఇన్హెరిట్;

లక్షణ విలువ

సాంకేతిక వివరాలు

బ్రౌజర్ మద్దతు

పట్టికలో ఉన్న సంఖ్యలు ఈ లక్షణాన్ని పూర్తిగా మద్దతు ఇచ్చే మొదటి బ్రౌజర్ వెర్షన్ నిర్దేశిస్తుంది.

相关页面

参考：CSS డయరెక్షన్ అట్రిబ్యూట్

参考：CSS స్క్రోల్-స్నాప్-అలైన్ అట్రిబ్యూట్

参考：CSS స్క్రోల్-స్నాప్-టైప్ అట్రిబ్యూట్

参考：CSS వ్రాటింగ్-మోడ్ అట్రిబ్యూట్