Source

Okugabanya ebanga

Bootstrap erimu ebika ebingi eby’okuddamu mu shorthand ne padding utility classes okukyusa endabika y’ekintu.

Engeri gye kikola

Gabira responsive-friendly marginoba paddingvalues ​​ku element oba subset y'enjuyi zaayo ne shorthand classes. Mulimu okuwagira eby’obugagga ssekinnoomu, eby’obugagga byonna, n’eby’obugagga ebyesimbye n’eby’okwesimbye. Ebika bizimbibwa okuva ku maapu ya Sass eya bulijjo okuva ku .25remokutuuka ku 3rem.

Okuwandiika ennukuta

Ebikozesebwa mu kugabanya ebanga ebikola ku bifo byonna eby’okumenya, okuva xsku okutuuka ku xl, tebirina bufupi bwa bifo bya kumenya mu byo. Kino kiri bwe kityo kubanga kiraasi ezo zikozesebwa okuva min-width: 0n’okudda waggulu, era bwe zityo tezisibibwa ku kubuuza kwa mikutu. Ebifo ebisigaddewo, naye, bibaamu enfunyiro y’okumenya.

Ebisulo bituumibwa amannya nga tukozesa ensengeka {property}{sides}-{size}ya xs, , , ne .{property}{sides}-{breakpoint}-{size}smmdlgxl

Awali ebintu ekimu ku:

  • m- ku bibiina ebiteekawomargin
  • p- ku bibiina ebiteekawopadding

Awali enjuyi emu ku:

  • t- ku bibiina ebiteeka margin-topobapadding-top
  • b- ku bibiina ebiteeka margin-bottomobapadding-bottom
  • l- ku bibiina ebiteeka margin-leftobapadding-left
  • r- ku bibiina ebiteeka margin-rightobapadding-right
  • x- ku bibiina ebiteeka byombi *-leftne*-right
  • y- ku bibiina ebiteeka byombi *-topne*-bottom
  • blank - ku kiraasi eziteeka a marginoba paddingku njuyi zonna 4 eza elementi

Awali sayizi emu ku:

  • 0- ku bibiina ebimalawo marginoba paddingnga bibiteeka ku0
  • 1- (by default) ku kiraasi eziteeka marginoba paddingku$spacer * .25
  • 2- (by default) ku kiraasi eziteeka marginoba paddingku$spacer * .5
  • 3- (by default) ku kiraasi eziteeka marginoba paddingku$spacer
  • 4- (by default) ku kiraasi eziteeka marginoba paddingku$spacer * 1.5
  • 5- (by default) ku kiraasi eziteeka marginoba paddingku$spacer * 3
  • auto- ku kiraasi eziteeka ku marginku auto

(Osobola okwongerako sayizi endala ng'ossaako ebiyingizibwa ku $spacersnkyukakyuka ya maapu ya Sass.)

Eby’okulabirako

Wano waliwo ebyokulabirako ebikiikirira ebika bino:

.mt-0 {
  margin-top: 0 !important;
}

.ml-1 {
  margin-left: ($spacer * .25) !important;
}

.px-2 {
  padding-left: ($spacer * .5) !important;
  padding-right: ($spacer * .5) !important;
}

.p-3 {
  padding: $spacer !important;
}

Okuteeka wakati mu bbanga (horizontal centering).

Okugatta ku ekyo, Bootstrap era erimu .mx-autokiraasi ey’okussa wakati mu bbanga (horizontal centering fixed-width block level content) ebirimu —kwe kugamba, ebirimu ebirina display: blockn’ekisengekeddwa width—nga oteeka emimwa egy’okwebungulula ku auto.

Ekintu ekiri wakati
<div class="mx-auto" style="width: 200px;">
  Centered element
</div>