Bootstrap grid mysallary

“Bootstrap” grid ulgamynyň gurluşygy bilen tanyşmak üçin esasy gözenek düzülişleri.

Üç sany sütün

Iş stollaryndan başlap, uly iş stollaryna çenli ulaldylan üç sany giňlikdäki sütün alyň . Jübi enjamlarynda, planşetlerde we aşakda sütünler awtomatiki usulda saklanar.

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

Üç sany deň däl sütün

Iş stollaryndan başlap, dürli giňlikdäki uly iş stollaryna çenli üç sany sütün alyň . Grid gorizontal blok üçin gözenek sütünleriniň on iki-e çenli goşmalydygyny ýadyňyzdan çykarmaň. Munuň üstesine-de, sütünler haýsy görnüşe garamazdan tapawudy ýok.

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

Iki sütün

Iş stollaryndan başlap, uly iş stollaryna ulalmak üçin iki sütün alyň .

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

Doly ini, ýeke sütün

Doly giňlikdäki elementler üçin hiç hili gözenek synplary zerur däl.

Iki sany sütünli iki sütün

Resminamalara görä höwürtge aňsat - bar bolan sütüniň içinde bir hatar sütün goýuň. Bu size iş stolundan başlap, uly sütüniň içinde ýene iki (deň giňlik) bilen iki sany sütün berýär.

Jübi enjamlarynyň ululyklarynda, planşetlerde we aşakda bu sütünler we olaryň ýerleşdirilen sütünleri saklanar.

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

Garyşyk: ykjam we iş stoly

“Bootstrap 3” grid ulgamynda dört derejeli synp bar: xs (telefonlar), sm (planşetler), md (iş stollary) we lg (has uly iş stollary). Has dinamiki we çeýe tertipleri döretmek üçin bu synplaryň islendik kombinasiýasyny diýen ýaly ulanyp bilersiňiz.

Her bir synp derejesi ulalýar, ýagny xs we sm üçin birmeňzeş giňlikleri meýilleşdirýän bolsaňyz, diňe xs görkezmeli.

.col-xs-12 .col-md-8
.col-xs-6 .col-md-4
.col-xs-6 .col-md-4
.col-xs-6 .col-md-4
.col-xs-6 .col-md-4
.col-xs-6
.col-xs-6

Garyşyk: ykjam, planşet we iş stoly

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

Sütüni arassalamak

Deňsiz mazmun bilen oňaýsyz örtülmeginiň öňüni almak üçin belli nokatlarda ýüzüşleri arassalaň .

.col-xs-6 .col-sm-3
Görkezişiňizi üýtgediň ýa-da mysal üçin telefonyňyzda barlaň.
.col-xs-6 .col-sm-3
.col-xs-6 .col-sm-3
.col-xs-6 .col-sm-3

Täzeden düzmek, iteklemek we çekmek

Aýry-aýry nokatlarda ofsetleri, itekleri we çekmeleri täzeden düzüň.

.col-sm-5 .col-md-6
.col-sm-5 .col-sm-ofset-2 .col-md-6 .col-md-ofset-0
.col-sm-6 .col-md-5 .col-lg-6
.col-sm-6 .col-md-5 .col-md-ofset-2 .col-lg-6 .col-lg-ofset-0