View on GitHub
Position (位置)
使用這些輔助器可以快速配置元素的位置。
On this page
固定頂端
將元素固定在螢幕的頂端,邊緣相接。確保您了解專案中使用 fixed 定位的結果,可能會需要添加其他 CSS。
<div class="fixed-top">...</div>
固定底部
將元素固定在螢幕的底部,邊緣相接。確保您了解專案中使用 fixed 定位的結果,可能會需要添加其他 CSS。
<div class="fixed-bottom">...</div>
Sticky top
將元素固定在螢幕的底部,邊緣相接。但只有在滾動離開該元素之後才會執行。 .sticky-top
通用類別使用 CSS 的 position: sticky
,並非所有瀏覽器都完全支持。
<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>