Lavozim

Elementning o'rnini tezda sozlash uchun ushbu stenok yordam dasturlaridan foydalaning.

Umumiy qadriyatlar

Tez joylashishni aniqlash darslari mavjud, ammo ular javob bermaydi.

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

Ruxsat etilgan tepa

Elementni ko'rish oynasining yuqori qismiga, chetidan chetiga joylashtiring. Loyihangizdagi sobit pozitsiyaning oqibatlarini tushunganingizga ishonch hosil qiling; qo'shimcha CSS qo'shishingiz kerak bo'lishi mumkin.

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

Ruxsat etilgan pastki

Elementni ko'rish oynasining pastki qismiga, chetidan chetiga joylashtiring. Loyihangizdagi sobit pozitsiyaning oqibatlarini tushunganingizga ishonch hosil qiling; qo'shimcha CSS qo'shishingiz kerak bo'lishi mumkin.

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

Yopishqoq tepa

Elementni ko'rish oynasining yuqori qismiga chetidan chetiga o'rnating, lekin faqat uning yonidan o'tgandan keyin. Yordamchi dastur barcha brauzerlarda to'liq qo'llab-quvvatlanmaydigan .sticky-topCSS-lardan foydalanadi .position: sticky

IE11 va IE10 position: stickykabi ko'rsatiladi position: relative. Shunday qilib, biz @supportsso'rovga uslublarni o'rab olamiz va yopishqoqlikni faqat uni to'g'ri ko'rsata oladigan brauzerlar bilan cheklaymiz.

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