Chuyển đến nội dung chính Chuyển đến điều hướng tài liệu
Check
in English

Chức vụ

Sử dụng các trình trợ giúp này để nhanh chóng định cấu hình vị trí của một phần tử.

Đầu cố định

Định vị một phần tử ở đầu khung nhìn, từ cạnh này sang cạnh khác. Hãy chắc chắn rằng bạn hiểu các phân nhánh của vị trí cố định trong dự án của bạn; bạn có thể cần thêm CSS bổ sung.

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

Cố định đáy

Định vị một phần tử ở dưới cùng của khung nhìn, từ cạnh này sang cạnh khác. Hãy chắc chắn rằng bạn hiểu các phân nhánh của vị trí cố định trong dự án của bạn; bạn có thể cần thêm CSS bổ sung.

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

Dính trên cùng

Định vị một phần tử ở đầu khung nhìn, từ cạnh này sang cạnh khác, nhưng chỉ sau khi bạn cuộn qua nó.

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

Đầu dính đáp ứng

Các biến thể đáp ứng cũng tồn tại cho .sticky-toptiện ích.

<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>

Đáy dính

Định vị một phần tử ở dưới cùng của khung nhìn, từ cạnh này sang cạnh khác, nhưng chỉ sau khi bạn cuộn qua nó.

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

Đáy dính đáp ứng

Các biến thể đáp ứng cũng tồn tại cho .sticky-bottomtiện ích.

<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>