Imizekelo yegridi yeBootstrap

Uyilo lwegridi esisiseko ukuze uqhelane nesakhiwo ngaphakathi kwenkqubo yegridi yeBootstrap.

Kule mizekelo .themed-grid-coliklasi yongezwa kwiikholamu ukongeza umxholo othile. Olu ayilodidi olukhoyo kwi-Bootstrap ngokungagqibekanga.

Amanqanaba amahlanu egridi

Kukho amanqanaba amahlanu kwinkqubo yegridi yeBootstrap, enye kuluhlu ngalunye lwezixhobo esizixhasayo. Inqanaba ngalinye liqala kubungakanani obuncinci bendawo yokujonga kwaye lisebenza ngokuzenzekelayo kwizixhobo ezikhulu ngaphandle kokuba zibhalwe ngaphezulu.

.col-4
.col-4
.col-4
.col-sm-4
.col-sm-4
.col-sm-4
.col-md-4
.col-md-4
.col-md-4
.col-lg-4
.col-lg-4
.col-lg-4
.col-xl-4
.col-xl-4
.col-xl-4
.col-xxl-4
.col-xxl-4
.col-xxl-4

Iintsika ezintathu ezilinganayo

Fumana iikholamu ezintathu zobubanzi obulinganayo ukuqala kwiidesktops kunye nokukala kwiidesktop ezinkulu . Kwizixhobo eziphathwayo, iitafile kunye nangaphantsi, iikholamu ziya kuzipakisha ngokuzenzekelayo.

.col-md-4
.col-md-4
.col-md-4

Iikholamu ezintathu ezilinganayo enye indlela

Ngokusebenzisa .row-cols-*iiklasi, unokwenza lula igridi eneentsika ezilinganayo.

.columntwana we .row-cols-md-3
.columntwana we .row-cols-md-3
.columntwana we .row-cols-md-3

Iintsika ezintathu ezingalinganiyo

Fumana iikholamu ezintathu eziqala kwiidesktops kunye nokukala kwiidesktop ezinkulu zobubanzi obahlukeneyo. Khumbula, iikholamu zegridi kufuneka zidibanise ukuya kwishumi elinesibini kwibhloko enye ethe tye. Ngaphezu koko, kwaye iikholamu ziqala ukupakishwa nokuba ijongo lokujonga.

.col-md-3
.col-md-6
.col-md-3

Iikholamu ezimbini

Fumana iikholamu ezimbini eziqala kwiidesktop kunye nokukala kwiidesktop ezinkulu .

.col-md-8
.col-md-4

Ububanzi obupheleleyo, ikholamu enye

Akukho ziklasi zegridi eziyimfuneko kwizinto ezinobubanzi obugcweleyo.

Iikholamu ezimbini ezineentsika ezimbini ezifakwe kwindlwane

Ngokwamaxwebhu, ukwenza indlwane kulula-beka nje umqolo wekholamu ngaphakathi koluhlu olukhoyo. Oku kukunika iikholamu ezimbini eziqala kwiidesktop kunye nokukala kwiidesktop ezinkulu , nezinye ezimbini (ububanzi obulinganayo) ngaphakathi komhlathi omkhulu.

Kwiisayizi zesixhobo esiphathwayo, iitafile kunye nasezantsi, le kholamu kunye neintsika zazo ezifakwe kwindlwane ziya kupakishwa.

.col-md-8
.col-md-6
.col-md-6
.col-md-4

Ixutywe: iselula kunye nedesktop

Inkqubo yegridi yeBootstrap v5 inamanqanaba amathandathu eeklasi: xs (incinci kakhulu, le infix yodidi ayisetyenziswa), sm (incinci), md (phakathi), lg (enkulu), xl (x-enkulu), kunye xxl (xx) -enkulu). Ungasebenzisa phantse naluphi na udibaniso lwezi klasi ukwenza uyilo oluguquguqukayo nolubhetyebhetye.

Inqanaba ngalinye leeklasi liyanyuka, oku kuthetha ukuba uceba ukuseta ububanzi obufanayo be-md, lg, xl kunye ne-xxl, kufuneka uchaze kuphela md.

.col-md-8
.col-6 .col-md-4
.col-6 .col-md-4
.col-6 .col-md-4
.col-6 .col-md-4
.col-6
.col-6

Ixutywe: iselula, ithebhulethi, kunye nedesktop

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

Imijelo

Ngeeklasi .gx-*, i-gutters ethe tyaba inokulungiswa.

.col.gx-4ngeegutters _
.col.gx-4ngeegutters _
.col.gx-4ngeegutters _
.col.gx-4ngeegutters _
.col.gx-4ngeegutters _
.col.gx-4ngeegutters _

Sebenzisa .gy-*iiklasi ukulawula iigatha ezithe nkqo.

.col.gy-4ngeegutters _
.col.gy-4ngeegutters _
.col.gy-4ngeegutters _
.col.gy-4ngeegutters _
.col.gy-4ngeegutters _
.col.gy-4ngeegutters _

Ngeeklasi .g-*, i-gutters kumacala omabini inokulungiswa.

.col.g-3ngeegutters _
.col.g-3ngeegutters _
.col.g-3ngeegutters _
.col.g-3ngeegutters _
.col.g-3ngeegutters _
.col.g-3ngeegutters _

Izikhongozeli

Iiklasi ezongezelelweyo ezongeziweyo kwi-Bootstrap v4.4 zivumela izikhongozeli ezinobubanzi obuyi-100% kude kube yindawo ethile yokwahlukana. I-v5 yongeza i- xxlbreakpoint entsha.

.isikhongozeli
.isikhongozeli-sm
.isikhongozeli-md
.isikhongozeli-lg
.isikhongozeli-xl
.isikhongozeli-xxl
.inkonkxa-ulwelo