固定顶部
从一个边缘到另一个边缘,将一个元素固定到窗口的顶部。确保您了解项目中固定位置的影响;只需要添加以下CSS即可。
<div class="fixed-top">...</div>
固定底部
将元素固定在底部。
<div class="fixed-bottom">...</div>
粘性顶部
将元素定位在窗口的顶部,但只会在你滚动过去之后才可以。.sticky-top
是使用了CSS的position.sticky-top
。
<div class="sticky-top">...</div>
响应式粘顶(Responsive sticky top)
.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>