Go beakanya sekgoba
Bootstrap e akaretša mefuta e fapaneng ya shorthand arabela moedi le padding utility dihlopha ho fetola elemente ya ponahalo.
Kamoo e šomago ka gona
Abela go arabela-bogwera margin
goba padding
boleng go elemente goba sehlopha se senyenyane sa mahlakore a yona ka diklase tša mongwalokopana. E akaretša thekgo ya dithoto tša motho ka o tee ka o tee, dithoto ka moka, le dithoto tša go ema le tša go rapalala. Diklase di agilwe go tšwa go mmapa wa Sass wa go se fetoge go tloga go go .25rem
ya go 3rem
.
Notation
Didirišwa tša go arola sekgoba tšeo di šomago go dintlha ka moka tša go kgaotša, go tloga xs
go go ya go xl
, ga di na khutsofatšo ya dintlha tša go kgaotša go tšona. Se ke ka lebaka la gore diklase tšeo di dirišwa go tloga min-width: 0
le godimo, gomme ka go realo ga di tlemilwe ke potšišo ya boraditaba. Dintlha tše di šetšego tša go kgaotša, le ge go le bjalo, di akaretša khutsofatšo ya dintlha tša go kgaotša.
Diklase di reeletšwe maina ka go šomiša sebopego {property}{sides}-{size}
sa xs
le {property}{sides}-{breakpoint}-{size}
sa sm
, md
, lg
, le xl
.
Moo thoto e lego ye nngwe ya:
m
- bakeng sa diklase tse behamargin
p
- bakeng sa diklase tse behapadding
Moo mahlakore e lego e nngwe ya:
t
- bakeng sa diklase tse behamargin-top
kapapadding-top
b
- bakeng sa diklase tse behamargin-bottom
kapapadding-bottom
l
- bakeng sa diklase tse behamargin-left
kapapadding-left
r
- bakeng sa diklase tse behamargin-right
kapapadding-right
x
- bakeng sa diklase tse beha bobeli*-left
le*-right
y
- bakeng sa diklase tse beha bobeli*-top
le*-bottom
- lefeela - bakeng sa diklase tse beha a
margin
kapapadding
ka mahlakoreng ohle a 4 a elemente
Moo bogolo e lego e nngwe ya:
0
- bakeng sa diklase tse felisangmargin
kapapadding
ka ho e beha ho0
1
- (ka default) bakeng sa diklase tse behamargin
kapapadding
ho$spacer * .25
2
- (ka default) bakeng sa diklase tse behamargin
kapapadding
ho$spacer * .5
3
- (ka default) bakeng sa diklase tse behamargin
kapapadding
ho$spacer
4
- (ka default) bakeng sa diklase tse behamargin
kapapadding
ho$spacer * 1.5
5
- (ka default) bakeng sa diklase tse behamargin
kapapadding
ho$spacer * 3
auto
- bakeng sa diklase tse beha themargin
ho auto
(O ka oketša bogolo bjo bongwe ka go oketša dikeno go $spacers
phetogo ya mmapa wa Sass.)
Mehlala
Mehlala e mengwe ya boemedi ya diklase tše še:
.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;
}
Go tsepama ga go rapalala
Go tlaleletša, Bootstrap e akaretša gape le .mx-auto
sehlopha sa go tsepamiša ka go rapalala diteng tša maemo a boloko bja bophara bjo bo sa fetogego—ke gore, diteng tšeo di nago display: block
le le width
sete—ka go beakanya mapheko a go rapalala go auto
.
<div class="mx-auto" style="width: 200px;">
Centered element
</div>
Moedi wa go se loke
Ka CSS, margin
thepa ka sebelisa boleng bo mpe ( padding
ke ke). Go tloga go 4.2, re okeditše didirišwa tša margin tše mpe bakeng sa bogolo bjo bongwe le bjo bongwe bjo e sego bja lefela bjo bo feletšego bjo bo lokeleditšwego ka mo godimo (mohlala, 1
, 2
, 3
, 4
, 5
). Didirišwa tše di loketše go beakanya diphaephe tša kholomo ya keriti go ralala le mafelo a go kgaotša.
Popegopolelo e nyakile go swana le didirišwa tša go se fetoge, tša mošito wo mobotse, eupša ka tlaleletšo ya n
pele ga bogolo bjo bo kgopetšwego. Mona ke sehlopha sa mohlala seo se fapaneng le .mt-1
:
.mt-n1 {
margin-top: -0.25rem !important;
}
Mona ke mohlala wa go tlwaetša keriti ya Bootstrap ka md
ntlha ya go kgaotša ya magareng ( ) le go feta. Re okeditše .col
padding ka .px-md-5
gomme ka morago ra lwantšha seo ka .mx-md-n5
godimo ga motswadi .row
.
<div class="row mx-md-n5">
<div class="col px-md-5"><div class="p-3 border bg-light">Custom column padding</div></div>
<div class="col px-md-5"><div class="p-3 border bg-light">Custom column padding</div></div>
</div>