Source

Позиция

Элементтин ордун тез конфигурациялоо үчүн бул стенографиялык утилиттерди колдонуңуз.

Жалпы баалуулуктар

Ыкчам жайгаштыруу класстары бар, бирок алар жооп бербейт.

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

Бекитилген үстү

Элементти көрүү терезесинин жогору жагына, четинен четине чейин жайгаштырыңыз. Долбооруңуздагы туруктуу позициянын кесепеттерин түшүнгөнүңүздү текшериңиз; кошумча CSS кошуу керек болушу мүмкүн.

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

Бекитилген түбү

Элементти көрүү терезесинин ылдый жагына, четинен четине чейин жайгаштырыңыз. Долбооруңуздагы туруктуу позициянын кесепеттерин түшүнгөнүңүздү текшериңиз; кошумча CSS кошуу керек болушу мүмкүн.

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

Жабышкак үстү

Элементти көрүү терезесинин жогору жагына, четинен четине, бирок анын жанынан өткөндөн кийин гана жайгаштырыңыз. Утилита бардык браузерлерде толук колдоого алынбаган .sticky-topCSS'ти колдонот .position: sticky

IE11 жана IE10 position: stickyкатары көрсөтүлөт position: relative. Ошентип, биз стилдерди @supportsсуроого ороп, жабышчаактыкты аны туура көрсөтө алган браузерлерге гана чектейбиз.

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