Позиция
Элемент орнын жылдам конфигурациялау үшін осы стенографиялық утилиталарды пайдаланыңыз.
Ортақ құндылықтар
Жылдам орналасу сабақтары қол жетімді, бірақ олар жауап бермейді.
<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-top
Утилита position: sticky
барлық браузерлерде толық қолдау көрсетілмейтін CSS-ті пайдаланады .
IE11 және IE10 position: sticky
ретінде көрсетіледі position: relative
. Осылайша, біз стильдерді @supports
сұрауға орап, жабысқақтықты тек оны дұрыс көрсете алатын браузерлермен шектейміз.
<div class="sticky-top">...</div>