justifyContent
Misol
Flex <div> elementining elementlari orasida biroz bo‘sh joy qoldiring:
document.getElementById("main").style.justifyContent = "space-between";O‘zingiz sinab ko‘ring »
Tavsif
justifyContent xususiyati flex konteyner elementlari asosiy o‘qda (gorizontal bo‘yicha) mavjud bo‘sh joyning hammasini egallamaganda ularni tekislaydi.
Maslahat: Elementlarni kesishuvchi o‘q bo‘ylab (vertikal) tekislash uchun alignContent xususiyatidan foydalaning.
Brauzerlarda qo‘llab-quvvatlash
| Xususiyat | |||||
|---|---|---|---|---|---|
| justifyContent | Ha | 12.0 | Ha | 9.0 | Ha |
Sintaksis
justifyContent xususiyatini qaytarish:
object.style.justifyContent
justifyContent xususiyatini o‘rnatish:
object.style.justifyContent = "flex-start|flex-end|center|space-between|space-around|initial|inherit"
Xususiyat qiymatlari
| Qiymat | Tavsif |
|---|---|
| flex-start | Standart qiymat. Elementlar konteyner boshida joylashadi |
| flex-end | Elementlar konteyner oxirida joylashadi |
| center | Elementlar konteyner markazida joylashadi |
| space-between | Elementlar qatorlar orasida bo‘sh joy qoldirib joylashadi |
| space-around | Elementlar qatorlardan oldin, ular orasida va keyin bo‘sh joy qoldirib joylashadi |
| initial | Bu xususiyatni standart qiymatiga o‘rnatadi. initial haqida o‘qing |
| inherit | Bu xususiyatni ota elementidan meros qilib oladi. inherit haqida o‘qing |
Texnik tafsilotlar
| Standart qiymat: | flex-start |
|---|---|
| Qaytariladigan qiymat: | Elementning justify-content xususiyatini ifodalovchi String |
| CSS versiyasi | CSS3 |
Tegishli sahifalar
CSS ma’lumotnomasi: justify-content xususiyati
HTML DOM STYLE ma’lumotnomasi: alignContent xususiyati
HTML DOM STYLE ma’lumotnomasi: alignItems xususiyati
HTML DOM STYLE ma’lumotnomasi: alignSelf xususiyati
W3Schools Pathfinder
Yutuqlaringizni kuzating – bu bepul!
