Source

kedudukan

Gunakan utiliti trengkas ini untuk mengkonfigurasi kedudukan elemen dengan cepat.

Nilai bersama

Kelas penentududukan pantas tersedia, walaupun ia tidak responsif.

<div class="position-static">...</div>
<div class="position-relative">...</div>
<div class="position-absolute">...</div>
<div class="position-fixed">...</div>
<div class="position-sticky">...</div>

Bahagian atas tetap

Letakkan elemen di bahagian atas port pandangan, dari tepi ke tepi. Pastikan anda memahami kesan kedudukan tetap dalam projek anda; anda mungkin perlu menambah CSS tambahan.

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

Bawah tetap

Letakkan elemen di bahagian bawah port pandangan, dari tepi ke tepi. Pastikan anda memahami kesan kedudukan tetap dalam projek anda; anda mungkin perlu menambah CSS tambahan.

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

Bahagian atas melekit

Letakkan elemen di bahagian atas port pandangan, dari tepi ke tepi, tetapi hanya selepas anda menatal melepasinya. Utiliti .sticky-topmenggunakan CSS position: sticky, yang tidak disokong sepenuhnya dalam semua penyemak imbas.

IE11 dan IE10 akan dipaparkan position: stickysebagai position: relative. Oleh itu, kami membungkus gaya dalam @supportspertanyaan, mengehadkan kelekitan hanya kepada pelayar yang boleh memaparkannya dengan betul.

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