Izibonelo zegridi ye-Bootstrap

Izakhiwo zegridi eziyisisekelo ukuze ujwayelane nokwakha ngaphakathi kwesistimu yegridi ye-Bootstrap.

Kulezi zibonelo .themed-grid-colikilasi lengezwa kumakholomu ukuze kwengezwe ingqikithi ethile. Leli akulona ikilasi elitholakala ku-Bootstrap ngokuzenzakalelayo.

Izigaba ezinhlanu zamagridi

Kunezigaba ezinhlanu ohlelweni lwegridi ye-Bootstrap, eyodwa yohlu ngalunye lwamadivayisi esiwasekelayo. Isigaba ngasinye siqala kusayizi omncane wembobo yokubuka futhi sisebenza ngokuzenzakalelayo kumadivayisi amakhulu ngaphandle kwalapho kubhalwe 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

Amakholomu amathathu alinganayo

Thola amakholomu amathathu anobubanzi obulinganayo uqale kumadeskithophu futhi ulinganisele kumadeskithophu amakhulu . Kumadivayisi eselula, amathebulethi nangaphansi, amakholomu azostake ngokuzenzakalelayo.

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

Amakholomu amathathu angalingani

Thola amakholomu amathathu aqala kumadeskithophu bese ufinyelela kumadeskithophu amakhulu anobubanzi obuhlukahlukene. Khumbula, amakholomu egridi kufanele afinyelele eshumini nambili kubhulokhi eyodwa evundlile. Ngaphezu kwalokho, namakholomu aqala ukunqwabelana kungakhathaliseki ukuthi imbobo yokubuka.

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

Amakholomu amabili

Thola amakholomu amabili aqala kumadeskithophu bese ufinyelela kumadeskithophu amakhulu .

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

Ububanzi obugcwele, ikholomu eyodwa

Awekho amakilasi egridi adingekayo kuma-elementi anobubanzi obugcwele.

Amakholomu amabili anamakholomu amabili anesidleke

Ngokwamadokhumenti, ukwenza isidleke kulula—vele ufake umugqa wamakholomu ngaphakathi kwekholomu ekhona. Lokhu kukunikeza amakholomu amabili aqala kumadeskithophu bese ufinyelela kumadeskithophu amakhulu , namanye amabili (ububanzi obulinganayo) ngaphakathi kwekholomu enkulu.

Kosayizi bedivayisi yeselula, amathebulethi naphansi, lawa makholomu namakholomu awo akhiwe azonqwabelana.

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

Okuhlanganisiwe: iselula nedeskithophu

Uhlelo lwegridi ye-Bootstrap v4 lunezigaba ezinhlanu zamakilasi: xs (okuncane kakhulu), sm (okuncane), md (okumaphakathi), lg (okukhulu), kanye ne-xl (okukhulu ngokwengeziwe). Ungasebenzisa cishe noma iyiphi inhlanganisela yalezi zigaba ukuze udale izakhiwo eziguqukayo nezivumelana nezimo.

Isigaba ngasinye samakilasi siyakhuphuka, okusho ukuthi uma uhlela ukusetha ububanzi obufanayo buka-xs no-sm, udinga kuphela ukucacisa u-xs.

.col-12 .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

Okuhlanganisiwe: iselula, ithebhulethi, nedeskithophu

.col-12 .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