Bootstrap grid ɛgzampul dɛn

Besik grid layout fɔ mek yu sabi fɔ bil insay di Bootstrap grid sistem.

Insay dɛn ɛgzampul ya .themed-grid-col, dɛn ad di klas to di kɔlɔm dɛn fɔ ad sɔm tim dɛn. Dis nɔto klas we de na Bootstrap bay difɔlt.

Fayv grid taya dɛn

Fayv taya de fɔ di Bootstrap grid sistem, wan fɔ ɛni rɛnj ɔf divays dɛn we wi de sɔpɔt. Ɛni taya de stat wit wan minimum viupɔt saiz ɛn i de aplay fɔ di big divays dɛn ɔtomɛtik wan pas dɛn ɔvarayd dɛn.

.kɔl-4
.kɔl-4
.kɔl-4
.kɔl-sm-4
.kɔl-sm-4
.kɔl-sm-4
.kɔl-md-4
.kɔl-md-4
.kɔl-md-4
.kɔl-lg-4
.kɔl-lg-4
.kɔl-lg-4
.kɔl-xl-4
.kɔl-xl-4
.kɔl-xl-4

Tri ikwal kɔlɔm dɛn

Gɛt tri ikwal-wid kɔlɔm dɛn we bigin na dɛsktɔp ɛn skel to big dɛsktɔp dɛn . Na mobayl divays dɛn, tablɛt dɛn ɛn dɔŋ ya, di kɔlɔm dɛn go stak ɔtomɛtik wan.

.kɔl-md-4
.kɔl-md-4
.kɔl-md-4

Tri kɔlɔm dɛn we nɔ ikwal

Gɛt tri kɔlɔm dɛn we bigin na dɛsktɔp ɛn skel to big dɛsktɔp dɛn we gɛt difrɛn wit. Mɛmba se, grid kɔlɔm dɛn fɔ ad to twɛlv fɔ wan ɔrizɔntal blɔk. Mɔ pas dat, ɛn kɔlɔm dɛn bigin fɔ stak ilɛksɛf na di say we dɛn de si di pikchɔ.

.kɔl-md-3
.kɔl-md-6
.kɔl-md-3

Tu kɔlɔm dɛn

Gɛt tu kɔlɔm dɛn we bigin na dɛsktɔp ɛn skel to big dɛsktɔp dɛn .

.kɔl-md-8
.kɔl-md-4

Ful wit, wan kɔlɔm

No grid klas nɔ nid fɔ ful-wid ɛlimɛnt dɛn.


Tu kɔlɔm dɛn wit tu kɔlɔm dɛn we dɛn dɔn nɛst

Per di dokumɛnt, nest izi—jɔs put wan row fɔ kɔlɔm dɛn insay wan kɔlɔm we dɔn de. Dis de gi yu tu kɔlɔm dɛn we de stat na dɛsktɔp ɛn skel to big dɛsktɔp , wit ɔda tu (ikwal wit) insay di big kɔlɔm.

Na mobayl divays saiz, tablɛt ɛn dɔŋ, dɛn kɔlɔm ya ɛn dɛn nest kɔlɔm dɛn go stak.

.kɔl-md-8
.kɔl-md-6
.kɔl-md-6
.kɔl-md-4

Miks: mobayl ɛn dɛsktɔp

Di Bootstrap v4 grid sistem gɛt fayv taya dɛn fɔ klas dɛn: xs (ɛkstra smɔl), sm (smɔl), md (midul), lg (big), ɛn xl (ɛkstra big). Yu kin yuz klos to ɛni kɔmbaynshɔn fɔ dɛn klas ya fɔ mek mɔ dinamik ɛn fleksibul layout dɛn.

Ɛni taya fɔ klas dɛn de skel ɔp, we min se if yu plan fɔ sɛt di sem wit fɔ xs ɛn sm, yu jɔs nid fɔ spɛsifa xs.

.kɔl-12 .kɔl-md-8
.kɔl-6 .kɔl-md-4
.kɔl-6 .kɔl-md-4
.kɔl-6 .kɔl-md-4
.kɔl-6 .kɔl-md-4
.kɔl-6
.kɔl-6

Miks: mobayl, tablɛt, ɛn dɛsktɔp

.kol-12 .kol-sm-6 .kol-lg-8
.kɔl-6 .kɔl-lg-4
.kɔl-6 .kɔl-sm-4
.kɔl-6 .kɔl-sm-4
.kɔl-6 .kɔl-sm-4