Sertifikat olingYANGIW3Schools ilovasiiOS va AndroidSarguzashtni boshlang

CSS position

ULASHISH

CSS joylashuvi

CSS positioning — veb-sahifa ichida elementlarning joylashuvini boshqarish haqidadir.

CSS positioning bilan normal hujjat oqimini o‘zgartirishingiz mumkin.

CSS position xossasi

position xossasi element uchun joylashtirish turini belgilaydi.

Bu xossa quyidagi qiymatlardan biriga ega bo‘lishi mumkin:

  • static — Bu standart qiymat. Element normal hujjat oqimi bo‘yicha joylashadi
  • relative — Element hujjat oqimidagi normal joyiga nisbatan joylashadi
  • fixed — Element viewport’ga nisbatan joylashadi
  • absolute — Element eng yaqin joylashtirilgan ajdodga nisbatan joylashadi
  • sticky — Element scroll joyiga qarab relative va fixed joylashuv o‘rtasida almashadi

So‘ng elementlar top, bottom, left va right xossalari bilan o‘z yakuniy joyiga joylashtiriladi.

CSS position: static

Barcha HTML elementlari sukut bo‘yicha statik tarzda joylashtirilgan.

Statik joylashtirilgan elementlar top, bottom, left va right xossalaridan ta’sir ko‘rmaydi.

position: static; li element har doim sahifaning normal oqimi bo‘yicha joylashadi:

Bu <div> elementida position: static; berilgan.

Mana ishlatilgan CSS:

Misol

div.static {
  position: static;
  border: 3px solid #73AD21;
}
O‘zingiz sinab ko‘ring »

CSS position: relative

position: relative; li element hujjat oqimidagi normal joyiga nisbatan joylashadi.

top, right, bottom va left xossalarini belgilash elementni normal joyidan surishiga olib keladi. Boshqa kontent element qoldirgan bo‘sh joyga sig‘ishi uchun moslashtirilmaydi.

Bu <div> elementida position: relative berilgan va u odatiy joyidan 30 px o‘ngga siljitilgan

Mana ishlatilgan CSS:

Misol

div.relative {
  position: relative;
  left: 30px;
  border: 3px solid #73AD21;
}
O‘zingiz sinab ko‘ring »

‹ OrqagaKeyingisi

W3Schools Pathfinder

Yutuqlaringizni kuzating – bu bepul!

Ro'yxatdan o'tishKirish