Ohatra amin'ny grids bootstrap

Fandrafetana rindran-damina fototra mba hahafantaranao ny fananganana ao anatin'ny rafitra grid Bootstrap.

Amin'ireo ohatra ireo .themed-grid-coldia ampiana ny kilasy amin'ny tsanganana mba hanampiana lohahevitra sasany. Ity dia tsy kilasy misy ao amin'ny Bootstrap amin'ny alàlan'ny default.

Five grid tiers

Misy ambaratonga dimy ny rafitra grid Bootstrap, iray isaky ny fitaovana tohananay. Ny ambaratonga tsirairay dia manomboka amin'ny haben'ny efitra fijerevana kely indrindra ary mihatra ho azy amin'ireo fitaovana lehibe kokoa raha tsy hoe nosoloina.

.col-4

.col-sm-4

.col-md-4

.col-lg-4

.col-xl-4

.col-xxl-4

Andry telo mitovy

Mahazoa tsanganana telo mitovy sakan'ny manomboka amin'ny birao ary afindrao amin'ny birao lehibe . Amin'ny fitaovana finday, takelaka ary ambany, ny tsanganana dia hitambatra ho azy.

.col-md-4

Alternative tsanganana telo mitovy

Amin'ny alàlan'ny fampiasana ireo .row-cols-*kilasy dia azonao atao mora ny mamorona tsipika misy tsanganana mitovy.

.colzanaky ny .row-cols-md-3

Andry telo tsy mitovy

Mahazoa tsanganana telo manomboka amin'ny birao ary manaova scaling amin'ny birao lehibe amin'ny sakany isan-karazany. Tsarovy fa ny tsanganana grid dia tokony hanampy hatramin'ny roa ambin'ny folo ho an'ny sakana marindrano iray. Mihoatra noho izany, ary ny tsanganana manomboka stacking na inona na inona viewport.

.col-md-3

.col-md-6

.col-md-3

Andry roa

Mahazoa tsanganana roa manomboka amin'ny birao ary afindrao amin'ny birao lehibe .

.col-md-8

.col-md-4

Feno sakany, tsanganana tokana

Tsy misy kilasy grid ilaina ho an'ny singa feno sakany.

Andry roa misy andry roa misy akany

Araka ny antontan-taratasy dia mora ny manao akany—apetraho fotsiny ny andalana misy tsanganana ao anaty tsanganana efa misy. Izany dia manome anao tsanganana roa manomboka eo amin'ny birao sy ny scaling amin'ny birao lehibe , miaraka amin'ny roa hafa (mitovy sakany) ao anatin'ny tsanganana lehibe kokoa.

Amin'ny haben'ny fitaovana finday, takelaka ary ambany, ireo tsanganana ireo sy ny tsanganana misy akany dia hitambatra.

.col-md-8

.col-md-6

.col-md-4

Mifangaro: finday sy desktop

Ny rafitra grid Bootstrap v5 dia manana kilasy enina: xs (kely fanampiny, tsy ampiasaina ity infix ity), sm (kely), md (medium), lg (lehibe), xl (x-lehibe), ary xxl (xx). - lehibe). Azonao atao ny mampiasa saika ny fitambaran'ireo kilasy ireo mba hamoronana drafitra mavitrika sy mora kokoa.

Ny ambaratonga tsirairay amin'ny kilasy dia miakatra, midika izany fa raha mikasa ny hametraka ny sakany mitovy amin'ny md, lg, xl ary xxl ianao, dia mila manondro md fotsiny ianao.

.col-md-8

.col-6 .col-md-4

.col-6

Mifangaro: finday, tablette ary desktop

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

.col-6 .col-lg-4

.col-6 .col-sm-4

tatatra

Miaraka amin'ny .gx-*kilasy dia azo amboarina ny tatatra marindrano.

.colmiaraka amin'ny .gx-4tatatra

Ampiasao ireo .gy-*kilasy hifehezana ny tatatra mitsangana.

.colmiaraka amin'ny .gy-4tatatra

Miaraka amin'ny .g-*kilasy dia azo ahitsy ny tatatra amin'ny lafiny roa.

.colmiaraka amin'ny .g-3tatatra

fitoeran

Ny kilasy fanampiny ampiana ao amin'ny Bootstrap v4.4 dia mamela ireo fitoeran-javatra mivelatra 100% mandra-pahatongan'ny teboka iray manokana. v5 dia manampy teboka fiatoana vaovao xxl.

.container

.container-sm

.container-md

.container-lg

.container-xl

.container-xxl

.container-fluid