Eisimpleirean de griod bootstrap

Dealbhadh clèithe bunaiteach gus eòlas fhaighinn air togail taobh a-staigh siostam clèithe Bootstrap.

Anns na h-eisimpleirean seo tha an .themed-grid-colclas air a chur ris na colbhan gus cuspairean a chur ris. Chan e clas a tha seo a tha ri fhaighinn ann am Bootstrap gu bunaiteach.

Còig ìrean cliath

Tha còig ìrean ann an siostam clèithe Bootstrap, aon airson gach raon de dh’ innealan ris a bheil sinn a’ toirt taic. Bidh gach sreath a’ tòiseachadh aig meud seallaidh as ìsle agus a’ buntainn gu fèin-ghluasadach ris na h-innealan nas motha mura tèid an toirt thairis.

.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

Trì colbhan co-ionann

Faigh trì colbhan den aon leud a’ tòiseachadh aig deasg agus a’ sgèileadh gu deasgaichean mòra . Air innealan gluasadach, clàran agus gu h-ìosal, thèid na colbhan a chruachadh gu fèin-ghluasadach.

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

Trì colbhan neo-ionann

Faigh trì colbhan a’ tòiseachadh aig deasg agus a’ sgèileadh gu deasgaichean mòra de dhiofar leud. Cuimhnich gum bu chòir colbhan clèithe suas ri dusan a chur airson aon bhloc còmhnard. A bharrachd air an sin, agus bidh colbhan a’ tòiseachadh a’ cruachadh ge bith dè an sealladh-seallaidh a th’ ann.

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

Dà cholbh

Faigh dà cholbh a’ tòiseachadh aig deasg agus a’ sgèileadh gu deasgaichean mòra .

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

Leud iomlan, colbh singilte

Chan eil feum air clasaichean clèithe airson eileamaidean làn-leud.

Dà cholbh le dà cholbh neadachaidh

A rèir na sgrìobhainnean, tha e furasta neadachadh - dìreach cuir sreath de cholbhan taobh a-staigh colbh a tha ann mu thràth. Bheir seo dhut dà cholbh a’ tòiseachadh aig deasg agus a’ sgèileadh gu deasgaichean mòra , le dhà eile (leud co-ionann) taobh a-staigh a’ cholbh as motha.

Aig meudan innealan gluasadach, clàran agus sìos, thèid na colbhan sin agus na colbhan neadachaidh aca a chruachadh.

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

Measgaichte: gluasadach agus deasg

Tha còig sreathan de chlasaichean aig siostam clèithe Bootstrap v4: xs (beag a bharrachd), sm (beag), md (meadhanach), lg (mòr), agus xl (mòr a bharrachd). Faodaidh tu cha mhòr measgachadh sam bith de na clasaichean sin a chleachdadh gus dealbhadh nas beothaile agus nas sùbailte a chruthachadh.

Bidh gach sreath de chlasaichean a’ leudachadh, a’ ciallachadh ma tha thu an dùil na h-aon leudan a shuidheachadh airson xs agus sm, chan fheum thu ach xs a shònrachadh.

.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

Measgaichte: gluasadach, clàr, agus deasg

.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