使用这些辅助工具可以快速配置元素的位置。
本页目录
固定顶部
将元素定位在视口顶部，从一边到另一边。确保你理解在项目中使用固定定位的影响；你可能需要添加额外的 CSS。
<div class="fixed-top">...</div>
固定底部
将元素定位在视口底部，从边到边。确保你了解固定定位在你的项目中的影响；你可能需要添加额外的 CSS。
<div class="fixed-bottom">...</div>
固定顶部
将元素定位在视口顶部，从边缘到边缘，但仅在你滚动过它之后。
<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>
<div class="sticky-xxl-top">Stick to the top on viewports sized XXL (extra-extra-large) or wider</div>
固定底部
将元素定位在视口底部，从边到边，但只有在滚动超过它之后才会这样。
<div class="sticky-bottom">...</div>
响应式粘性底部
针对.sticky-bottom效用也存在响应式变体。
<div class="sticky-sm-bottom">Stick to the bottom on viewports sized SM (small) or wider</div>
<div class="sticky-md-bottom">Stick to the bottom on viewports sized MD (medium) or wider</div>
<div class="sticky-lg-bottom">Stick to the bottom on viewports sized LG (large) or wider</div>
<div class="sticky-xl-bottom">Stick to the bottom on viewports sized XL (extra-large) or wider</div>
<div class="sticky-xxl-bottom">Stick to the bottom on viewports sized XXL (extra-extra-large) or wider</div>