Макет үчүн утилиталар
Мобилдик телефонго ыңгайлуураак жана тезирээк иштеп чыгуу үчүн, Bootstrap мазмунду көрсөтүү, жашыруу, тегиздөө жана аралыкты коюу үчүн ондогон пайдалуу класстарды камтыйт.
өзгөртүүdisplay
Мүлктүн жалпы баалуулуктарын ыкчам которуу үчүн дисплейдин утилиталарын колдонуңуз display
. Аны белгилүү бир көрүү терезелеринде көрсөтүү же жашыруу үчүн аны тор тутумубуз, мазмунубуз же компоненттерибиз менен аралаштырыңыз.
Flexbox параметрлери
Bootstrap flexbox менен курулган, бирок ар бир эле элемент display
өзгөртүлгөн эмес, display: flex
анткени бул көптөгөн керексиз жокко чыгарууларды кошуп, серепчинин негизги жүрүм-турумун күтүлбөгөн жерден өзгөртөт. Биздин компоненттердин көбү flexbox иштетилген менен курулган.
Элементке кошуу керек болсо, аны же жооп берүүчү варианттардын бири менен жасаңыз (мисалы, display: flex
) . Өлчөм , тегиздөө, аралык жана башкалар үчүн биздин кошумча флексбокс утилиталарыбызды колдонууга уруксат берүү үчүн бул класс же маани керек болот..d-flex
.d-sm-flex
display
Маржа жана толтуруу
Элементтер жана компоненттер кантип аралыкта жана өлчөмдөрүн көзөмөлдөө үчүн margin
жана padding
аралыкты колдонуңуз . 1rem
Bootstrap маанинин демейки $spacer
өзгөрмөсүнө негизделген аралыктар үчүн алты деңгээлдүү шкаланы камтыйт . Бардык көрүү порттору үчүн маанилерди тандаңыз (мисалы, LTR .me-3
үчүн margin-right: 1rem
) же конкреттүү көрүнүштөрдү максаттуу үчүн жооп берүүчү варианттарды тандаңыз (мисалы, .me-md-3
-LTR margin-right: 1rem
үчүн- үзгүлтүккө учураган чекиттен баштап md
).
Которууvisibility
Которуштуруунун display
кереги жок болгондо, биздин көрүнүү утилиталарыvisibility
менен элементти которуштурууга болот . Көрүнбөгөн элементтер дагы эле барактын макетине таасирин тийгизет, бирок көрүүчүлөрдөн көрүнөө жашырылат.