స్థానం

స్థిర టాప్

వీక్షణపోర్ట్ ఎగువన, అంచు నుండి అంచు వరకు మూలకాన్ని ఉంచండి. మీరు మీ ప్రాజెక్ట్‌లో స్థిర స్థానం యొక్క పరిణామాలను అర్థం చేసుకున్నారని నిర్ధారించుకోండి; మీరు అదనపు CSSని జోడించాల్సి రావచ్చు.

<div class="fixed-top">...</div>

స్థిర దిగువ

వీక్షణపోర్ట్ దిగువన, అంచు నుండి అంచు వరకు మూలకాన్ని ఉంచండి. మీరు మీ ప్రాజెక్ట్‌లో స్థిర స్థానం యొక్క పరిణామాలను అర్థం చేసుకున్నారని నిర్ధారించుకోండి; మీరు అదనపు CSSని జోడించాల్సి రావచ్చు.

<div class="fixed-bottom">...</div>

అంటుకునే టాప్

వీక్షణపోర్ట్ ఎగువన ఒక మూలకాన్ని అంచు నుండి అంచు వరకు ఉంచండి, కానీ మీరు దానిని స్క్రోల్ చేసిన తర్వాత మాత్రమే. .sticky-topయుటిలిటీ CSS లను ఉపయోగిస్తుంది , దీనికి position: stickyఅన్ని బ్రౌజర్‌లలో పూర్తిగా మద్దతు లేదు.

<div class="sticky-top">...</div>

రెస్పాన్సివ్ స్టిక్కీ టాప్

.sticky-topయుటిలిటీ కోసం ప్రతిస్పందించే వైవిధ్యాలు కూడా ఉన్నాయి .

<div class="sticky-sm-top">Stick to the top on viewports sized SM (small) or wider</div>
<div class="sticky-md-top">Stick to the top on viewports sized MD (medium) or wider</div>
<div class="sticky-lg-top">Stick to the top on viewports sized LG (large) or wider</div>
<div class="sticky-xl-top">Stick to the top on viewports sized XL (extra-large) or wider</div>