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

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

scroll-margin-inline-start అంతేకాక పందురు దిశలో, అంకితం చేయబడుతుంది అంకితం చేయబడుతుంది.

ఇది అంటే, మీరు స్క్రాల్ స్టాప్ చేసినప్పుడు, స్క్రాల్ వేగంగా సర్జకం అవుతుంది, మరియు కిరిది అంశం ప్రారంభంలో అంకితం చేయబడుతుంది మరియు కంటైనర్ మధ్య పందురు దిశలో నిర్దేశించిన దూరంలో స్టాప్ అవుతుంది.

పందురు దిశ అనేది కాల్పనికమైన పదకు తరువాతి అక్షరం ప్రస్తుత అక్షరం వద్ద క్రమబద్ధం చేయబడుతుంది, ఇది CSS display: inline; టాగ్లు (ఉదా <a> మరియు <strong> టాగ్లు) పాఠంలో సంస్థాపన పద్ధతి. పందురు దిశ రాతిపద్యంలో అనుసరిస్తుంది, ఉదా అరబ్బీ కొత్త అక్షరాలు ఎడమ నుండి కుడికి వరుసలో ఉంటాయి, అందువల్ల పందురు దిశ ఎడమ నుండి కుడికి ఉంటుంది, అంతేకాక ఇంగ్లీష్ పేజీలో పందురు దిశ కుడి నుండి ఎడమకు ఉంటుంది. పందురు దిశ చేయబడుతుంది CSS స్పెసిఫికేషన్ పరిమితి. direction మరియు writing-mode 定义。

吸附位置是指当你停止滚动时，子元素在容器中吸附到位的位置。

注意：此属性仅在 scroll-snap-align 属性为行内方向设置为 'start' 时才起作用。

CSS 的 scroll-margin-inline మరియు scroll-margin-block 属性与 CSS 属性 CSS స్క్రోల్-మార్జిన్-టాప్ అట్రిబ్యూట్、scroll-margin-bottom、scroll-margin-left మరియు scroll-margin-right 非常相似，但 scroll-margin-block మరియు scroll-margin-inline ఈ లక్షణం బ్లాక్ దిశ మరియు లోపలి దిశ పరంగా ఆధారపడి ఉంటుంది.

ఉదాహరణ

ఉదాహరణ 1

లోపలి దిశలో నిర్దేశించిన స్థానం నుండి స్క్రోలబల్ కంటైనర్ దూరం నిర్దేశించండి:

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

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

ఉదాహరణ 2

జిఎచ్టిఎమ్ ప్రతిపాదన ప్రకారం, <div> ఎలిమెంట్ యొక్క దిశ లక్షణ విలువ రుల్ట్ టో లెఫ్ట్ ఆఫ్ సెట్ చేసినప్పుడు పనిచేస్తుంది. writing-mode లక్షణ విలువ వెర్టికల్ రుల్ట్ లెఫ్ట్ ఆఫ్ సెట్ చేసినప్పుడు, పదక్షణ దిశ క్రిందకు పోతుంది. ఫలితంగా ఎలిమెంట్ యొక్క ప్రారంభ స్థానం ఎడమ వైపు నుండి ఉపరితలకు మారుతుంది:

div {
  scroll-margin-inline-start: 20px;
  writing-mode: vertical-rl;
}

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

ఉదాహరణ 3

జిఎచ్టిఎమ్ ప్రతిపాదన ప్రకారం, <div> ఎలిమెంట్ యొక్క దిశ లక్షణ విలువ రుల్ట్ టో లెఫ్ట్ ఆఫ్ సెట్ చేసినప్పుడు పనిచేస్తుంది. direction లక్షణ విలువ రుల్ట్ టో లెఫ్ట్ ఆఫ్ సెట్ చేసినప్పుడు, పదక్షణ దిశ కుడి నుండి ఎడమ వైపు పోతుంది. ఫలితంగా ఎలిమెంట్ యొక్క ప్రారంభ స్థానం ఎడమ వైపు నుండి కుడి వైపు మారుతుంది (అసలు దిశ కుడి వైపు కానీ ఇక్కడ ఎడమ వైపు అని చెప్పడం అప్రమేయ దిశ కుడి వైపు యొక్క ఎడమ వైపు అని అర్థం చేస్తుంది):

div {
  scroll-margin-inline-start: 20px;
  direction: rtl;
}

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

CSS సంకేతాలు

inset-inline-start: 0|value|initial|inherit;

లక్షణ విలువ

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

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

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

相关页面

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

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

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

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