Bootstrap grid entirnan te

Bootstrap grid system chhunga building siam dan tur hriat chian nan grid layouts bulpui ber berte.

Heng entîrnaah hian .themed-grid-coltheming engemaw zat dah belh tûrin column-ah class chu dah a ni. Hei hi Bootstrap-a default-a awm class a ni lo.

Grid tier panga a awm

Bootstrap grid system ah hian tier panga a awm a, kan support device range tin atan pakhat theuh a awm. Tier tin hi viewport size tlem berah a intan a, overridden a nih loh chuan device lian zawkah automatic in a apply vek a ni.

.col-4 a ni
.col-4 a ni
.col-4 a ni
.col-sm-4 tih a ni
.col-sm-4 tih a ni
.col-sm-4 tih a ni
.col-md-4 tih a ni
.col-md-4 tih a ni
.col-md-4 tih a ni
.col-lg-4 tih a ni
.col-lg-4 tih a ni
.col-lg-4 tih a ni
.col-xl-4 tih a ni
.col-xl-4 tih a ni
.col-xl-4 tih a ni
.col-xxl-4 tih a ni
.col-xxl-4 tih a ni
.col-xxl-4 tih a ni

Column inang pathum

Desktop atanga tan a, desktop lian tak takah scaling column pathum equal-width nei rawh . Mobile device, tablet leh a hnuai lamah chuan column te chu automatic in a stack ang.

.col-md-4 tih a ni
.col-md-4 tih a ni
.col-md-4 tih a ni

Column inang pathum alternative

Class te hmang hian .row-cols-*awlsam takin column inang grid siam theih a ni.

.colfa a ni .row-cols-md-3
.colfa a ni .row-cols-md-3
.colfa a ni .row-cols-md-3

Column inang lo pathum

Desktop atanga tan a, desktop lian zau zawng hrang hranga scaling atanga column pathum la rawh . Grid column te hi horizontal block pakhat atan sawm leh pahnih thleng add tur a ni tih hre reng ang che. Chu aia tam, leh column te chu viewport eng pawh ni se an stack tan thin.

.col-md-3 tih a ni
.col-md-6 tih a ni
.col-md-3 tih a ni

Column pahnih a awm

Desktop atanga tan atanga desktop lian tak takah column pahnih la rawh .

.col-md-8 tih a ni
.col-md-4 tih a ni

A zau zawng zawng, column pakhat chauh a awm

Full-width elements tan chuan grid class a ngai lo.

Column pahnih leh nested column pahnih

Documentation ang chuan nesting hi a awlsam a—column awmsa chhungah column row khat dah mai rawh. Hei hian desktop atanga tan atanga desktop lian thlenga scaling column pahnih a pe che a , column lian zawk chhungah pahnih dang (equal widths) a awm bawk.

Mobile device size, tablet leh down-ah te chuan heng column te leh an nested column te hi an stack ang.

.col-md-8 tih a ni
.col-md-6 tih a ni
.col-md-6 tih a ni
.col-md-4 tih a ni

Mixed: mobile leh desktop te a awm

Bootstrap v5 grid system hian class tier paruk a nei a, chungte chu xs (extra small, he class infix hi hman a ni lo), sm (small), md (medium), lg (large), xl (x-large), leh xxl (xx) te an ni -hrawl). Heng class hrang hrangte inzawmkhawmna zawng zawng deuhthaw hmangin layout dynamic leh flexible zawk siam theih a ni.

Class tier tin hian an scale up a, chu chu md, lg, xl leh xxl te tan width inang set i tum a nih chuan md chauh i specify a ngai tihna a ni.

.col-md-8 tih a ni
.col-6 .col-md-4 tih a ni
.col-6 .col-md-4 tih a ni
.col-6 .col-md-4 tih a ni
.col-6 .col-md-4 tih a ni
.col-6 a ni
.col-6 a ni

Mixed: mobile, tablet, leh desktop te a awm

.col-sm-6 .col-lg-8 tih a ni
.col-6 .col-lg-4 tih a ni
.col-6 .col-sm-4 tih a ni
.col-6 .col-sm-4 tih a ni
.col-6 .col-sm-4 tih a ni

Gutters te a awm

Class te nen .gx-*chuan horizontal gutters te chu a siam rem thei bawk.

.col.gx-4gutters te nen
.col.gx-4gutters te nen
.col.gx-4gutters te nen
.col.gx-4gutters te nen
.col.gx-4gutters te nen
.col.gx-4gutters te nen

Class te hmangin .gy-*vertical gutters te control thin ang che.

.col.gy-4gutters te nen
.col.gy-4gutters te nen
.col.gy-4gutters te nen
.col.gy-4gutters te nen
.col.gy-4gutters te nen
.col.gy-4gutters te nen

Class te nen .g-*chuan a sir lehlamah gutters te chu a siamrem theih a ni.

.col.g-3gutters te nen
.col.g-3gutters te nen
.col.g-3gutters te nen
.col.g-3gutters te nen
.col.g-3gutters te nen
.col.g-3gutters te nen

Container te pawh a awm

Bootstrap v4.4-a class dang dah belh chuan breakpoint bik thleng 100% zau container a phalsak a ni. v5 hian xxlbreakpoint thar a rawn belh leh a.

.container a awm
.container-sm a ni
.container-md tih a ni
.container-lg a ni
.container-xl a ni
.container-xxl a ni
.container-a tui awm