Bootstrap daim phiaj piv txwv

Cov kab sib chaws yooj yim kom tau txais koj paub txog kev tsim nyob hauv Bootstrap grid system.

Nyob rau hauv cov piv txwv no cov .themed-grid-colchav kawm yog ntxiv rau cov kab kom ntxiv ib co theming. Qhov no tsis yog chav kawm uas muaj nyob hauv Bootstrap los ntawm lub neej ntawd.

Tsib kab sib chaws

Muaj tsib theem rau Bootstrap kab sib chaws, ib qho rau txhua qhov khoom siv peb txhawb nqa. Txhua qib pib ntawm qhov tsawg kawg nkaus saib qhov loj thiab tuaj yeem siv rau cov khoom siv loj dua tshwj tsis yog overridden.

.col-4

.col-sm-4

.col-md-4

.col-lg-4

.col-xl-4

.col-xxl-4

Peb kab vaj huam sib luag

Tau peb kab sib npaug-dav pib ntawm desktops thiab scaling rau loj desktops . Ntawm cov khoom siv txawb, ntsiav tshuaj thiab hauv qab no, cov kab yuav cia li tso tseg.

.col-md-4

Peb cov kab sib npaug sib npaug

Los ntawm kev siv cov .row-cols-*chav kawm, koj tuaj yeem yooj yim tsim ib daim phiaj nrog cov kab sib npaug.

.coltus tub ntawm .row-cols-md-3

Peb kab tsis sib npaug

Tau peb kab pib ntawm desktops thiab scaling rau desktops loj ntawm ntau qhov dav. Nco ntsoov, kab sib chaws yuav tsum ntxiv txog kaum ob rau ib qho kab rov tav thaiv. Ntau tshaj qhov ntawd, thiab txhua kab pib stacking tsis hais qhov chaw saib.

.col-md-3

.col-md-6

.col-md-3

Ob kab

Tau txais ob kab pib ntawm desktops thiab scaling rau loj desktops .

.col-md-8

.col-md-4

Tag nrho dav, ib kem

Tsis muaj cov chav kawm kab sib chaws tsim nyog rau cov ntsiab lus dav dav.

Ob kab nrog ob kab nested

Raws li cov ntaub ntawv, kev ua zes yog ib qho yooj yim-tsuas yog muab ib kab ntawm kab hauv kab uas twb muaj lawm. Qhov no muab rau koj ob kab pib ntawm desktops thiab scaling rau loj desktops , nrog rau lwm ob (sib npaug widths) nyob rau hauv lub loj kem.

Ntawm qhov ntau thiab tsawg ntawm cov khoom siv txawb, cov ntsiav tshuaj thiab qis, cov kab no thiab lawv cov kab ke zes yuav pawg.

.col-md-8

.col-md-6

.col-md-4

Mixed: mobile thiab desktop

Lub Bootstrap v5 kab sib chaws muaj rau tiers ntawm cov chav kawm: xs (ntxiv me me, chav kawm infix tsis siv), sm (me), md (medium), lg (loj), xl (x-loj), thiab xxl (xx. - loj). Koj tuaj yeem siv yuav luag txhua qhov kev sib xyaw ntawm cov chav kawm no los tsim kom muaj kev sib tw thiab hloov tau yooj yim.

Txhua qib ntawm cov chav kawm nce, lub ntsiab lus yog tias koj npaj rau kev teeb tsa tib qhov dav rau md, lg, xl thiab xxl, koj tsuas yog yuav tsum tau qhia md.

.col-md-8

.col-6 .col-md-4

.col-6

Mixed: mobile, ntsiav tshuaj, thiab desktop

.col-sm-6 .col-lg-8

.col-6 .col-lg-4

.col-6 .col-sm-4

Gutters

Nrog .gx-*cov chav kawm, kab rov tav gutters tuaj yeem hloov kho.

.colnrog .gx-4gutters

Siv cov .gy-*chav kawm los tswj cov kav dej ntsug.

.colnrog .gy-4gutters

Nrog rau .g-*cov chav kawm, cov gutters hauv ob qho tib si tuaj yeem hloov kho.

.colnrog .g-3gutters

Ntim

Cov chav kawm ntxiv ntxiv hauv Bootstrap v4.4 tso cai rau cov thawv uas muaj 100% dav kom txog rau thaum ib qho kev tawg. v5 ntxiv qhov kev xxlncua tshiab.

. thawv

.container-sm

.container-md

.container-lg

.container-xl

.container-xxl

.container-kua