Bootstrap akoj apẹẹrẹ

Awọn ipilẹ akoj ipilẹ lati jẹ ki o faramọ pẹlu kikọ laarin eto akoj Bootstrap.

Ni awọn apẹẹrẹ, .themed-grid-colkilasi ti wa ni afikun si awọn ọwọn lati fi awọn akori kan kun. Eyi kii ṣe kilasi ti o wa ni Bootstrap nipasẹ aiyipada.

Marun akoj tiers

Awọn ipele marun wa si eto akoj Bootstrap, ọkan fun awọn ẹrọ kọọkan ti a ṣe atilẹyin. Ipele kọọkan bẹrẹ ni iwọn iwo wiwo ti o kere julọ ati pe o kan laifọwọyi si awọn ẹrọ ti o tobi ju ayafi ti o ba bori.

.kól-4
.kól-4
.kól-4
.kol-sm-4
.kol-sm-4
.kol-sm-4
.kol-md-4
.kol-md-4
.kol-md-4
.kol-lg-4
.kol-lg-4
.kol-lg-4
.kol-xl-4
.kol-xl-4
.kol-xl-4
.kol-xxl-4
.kol-xxl-4
.kol-xxl-4

Mẹta dogba ọwọn

Gba awọn ọwọn iwọn dogba mẹta ti o bẹrẹ ni awọn kọnputa agbeka ati iwọn si awọn kọǹpútà alágbèéká nla . Lori awọn ẹrọ alagbeka, awọn tabulẹti ati ni isalẹ, awọn ọwọn yoo wa ni akopọ laifọwọyi.

.kol-md-4
.kol-md-4
.kol-md-4

Meta dogba ọwọn yiyan

Nipa lilo awọn .row-cols-*kilasi, o le ni rọọrun ṣẹda akoj pẹlu awọn ọwọn dogba.

.colọmọ ti .row-cols-md-3
.colọmọ ti .row-cols-md-3
.colọmọ ti .row-cols-md-3

Awọn ọwọn ti ko dọgba mẹta

Gba awọn ọwọn mẹta ti o bẹrẹ ni awọn tabili itẹwe ati iwọn si awọn tabili itẹwe nla ti ọpọlọpọ awọn iwọn. Ranti, awọn ọwọn akoj yẹ ki o ṣafikun to mejila fun bulọọki petele kan. Diẹ sii ju iyẹn lọ, ati awọn ọwọn bẹrẹ akopọ laibikita oju-ọna wiwo.

.kol-md-3
.kol-md-6
.kol-md-3

Awọn ọwọn meji

Gba awọn ọwọn meji ti o bẹrẹ ni awọn kọǹpútà alágbèéká ati iwọn si awọn tabili itẹwe nla .

.kol-md-8
.kol-md-4

Iwọn ni kikun, ọwọn ẹyọkan

Ko si awọn kilasi akoj jẹ pataki fun awọn eroja iwọn ni kikun.


Awọn ọwọn meji pẹlu awọn ọwọn itẹ-ẹiyẹ meji

Fun iwe-ipamọ naa, itẹ-ẹiyẹ jẹ irọrun — kan fi awọn ila ti awọn ọwọn sinu iwe ti o wa tẹlẹ. Eyi yoo fun ọ ni awọn ọwọn meji ti o bẹrẹ ni awọn tabili itẹwe ati iwọn si awọn tabili itẹwe nla , pẹlu meji miiran (awọn iwọn dogba) laarin iwe nla.

Ni awọn iwọn ẹrọ alagbeka, awọn tabulẹti ati isalẹ, awọn ọwọn wọnyi ati awọn ọwọn itẹ-ẹiyẹ wọn yoo tojọ.

.kol-md-8
.kol-md-6
.kol-md-6
.kol-md-4

Adalu: mobile ati tabili

Eto grid Bootstrap v5 ni awọn ipele mẹfa ti awọn ipele: xs (afikun kekere, infix kilasi yii ko lo), sm (kekere), md (alabọde), lg (tobi), xl (x-tobi), ati xxl (xx). - tobi). O le lo fere eyikeyi akojọpọ awọn kilasi wọnyi lati ṣẹda agbara diẹ sii ati awọn ipalemo rọ.

Ipele kọọkan ti awọn kilasi ṣe iwọn soke, itumo ti o ba gbero lori ṣeto awọn iwọn kanna fun md, lg, xl ati xxl, iwọ nikan nilo lati pato md.

.kol-md-8
.col-6 .col-md-4
.col-6 .col-md-4
.col-6 .col-md-4
.col-6 .col-md-4
.kól-6
.kól-6

Adalu: alagbeka, tabulẹti, ati tabili tabili

.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

Awọn gutters

Pẹlu .gx-*awọn kilasi, awọn gutters petele le ṣe atunṣe.

.colpẹlu .gx-4gutters
.colpẹlu .gx-4gutters
.colpẹlu .gx-4gutters
.colpẹlu .gx-4gutters
.colpẹlu .gx-4gutters
.colpẹlu .gx-4gutters

Lo awọn .gy-*kilasi lati ṣakoso awọn gutter inaro.

.colpẹlu .gy-4gutters
.colpẹlu .gy-4gutters
.colpẹlu .gy-4gutters
.colpẹlu .gy-4gutters
.colpẹlu .gy-4gutters
.colpẹlu .gy-4gutters

Pẹlu .g-*awọn kilasi, awọn gutters ni awọn itọnisọna mejeeji le ṣe atunṣe.

.colpẹlu .g-3gutters
.colpẹlu .g-3gutters
.colpẹlu .g-3gutters
.colpẹlu .g-3gutters
.colpẹlu .g-3gutters
.colpẹlu .g-3gutters

Awọn apoti

Awọn kilasi afikun ti a ṣafikun ni Bootstrap v4.4 gba awọn apoti laaye ti o jẹ 100% fife titi aaye isinmi kan pato. v5 afikun titun kan xxlbreakpoint.

.epo
.eiyan-sm
.eiyan-md
.eiyan-lg
.epo-xl
.epo-xxl
.eiyan-omi