Shembuj të rrjetit të bootstrap
Paraqitjet bazë të rrjetit për t'ju njohur me ndërtimin brenda sistemit të rrjetit Bootstrap.
Në këta shembuj .themed-grid-col
klasa u shtohet kolonave për të shtuar disa tema. Kjo nuk është një klasë që është e disponueshme në Bootstrap si parazgjedhje.
Pesë nivele rrjeti
Ekzistojnë pesë nivele në sistemin e rrjetit Bootstrap, një për çdo gamë pajisjesh që mbështesim. Çdo nivel fillon me një madhësi minimale të portit të pamjes dhe zbatohet automatikisht në pajisjet më të mëdha, përveç rasteve kur anashkalohet.
Tre kolona të barabarta
Merrni tre kolona me gjerësi të barabartë duke filluar nga desktopët dhe duke u shkallëzuar në desktopët e mëdhenj . Në pajisjet celulare, tabletët dhe më poshtë, kolonat do të grumbullohen automatikisht.
Alternativa me tre kolona të barabarta
Duke përdorur .row-cols-*
klasat, mund të krijoni lehtësisht një rrjet me kolona të barabarta.
.col
fëmijë i
.row-cols-md-3
.col
fëmijë i
.row-cols-md-3
.col
fëmijë i
.row-cols-md-3
Tre kolona të pabarabarta
Merrni tre kolona duke filluar nga desktopët dhe duke u shkallëzuar në desktop të mëdhenj me gjerësi të ndryshme. Mbani mend, kolonat e rrjetit duhet të shtojnë deri në dymbëdhjetë për një bllok të vetëm horizontal. Më shumë se kaq, dhe kolonat fillojnë të grumbullohen pa marrë parasysh pamjen.
Dy kolona
Merrni dy kolona duke filluar nga desktopët dhe duke u shkallëzuar në desktop të mëdhenj .
Gjerësia e plotë, kolona e vetme
Asnjë klasë rrjeti nuk është e nevojshme për elementët me gjerësi të plotë.
Dy kolona me dy kolona të mbivendosura
Sipas dokumentacionit, foleja është e lehtë - thjesht vendosni një rresht kolonash brenda një kolone ekzistuese. Kjo ju jep dy kolona që fillojnë në desktop dhe shkallëzohen në desktop të mëdhenj , me dy të tjera (gjerësi të barabarta) brenda kolonës më të madhe.
Në madhësitë e pajisjes celulare, tabletët dhe më poshtë, këto kolona dhe kolonat e tyre të mbivendosura do të grumbullohen.
Të përziera: celular dhe desktop
Sistemi i rrjetit Bootstrap v4 ka pesë nivele klasash: xs (ekstra i vogël, ky infix i klasës nuk përdoret), sm (i vogël), md (i mesëm), lg (i madh) dhe xl (ekstra i madh). Ju mund të përdorni pothuajse çdo kombinim të këtyre klasave për të krijuar paraqitje më dinamike dhe fleksibël.
Çdo nivel i klasave rritet, që do të thotë nëse planifikoni të vendosni të njëjtat gjerësi për md, lg dhe xl, ju vetëm duhet të specifikoni md.
Të përziera: celular, tablet dhe desktop
Ulluqe
Me .gx-*
klasa, ulluqet horizontale mund të rregullohen.
.col
me
.gx-4
ulluqe
.col
me
.gx-4
ulluqe
.col
me
.gx-4
ulluqe
.col
me
.gx-4
ulluqe
.col
me
.gx-4
ulluqe
.col
me
.gx-4
ulluqe
Përdorni .gy-*
klasat për të kontrolluar ulluqet vertikale.
.col
me
.gy-4
ulluqe
.col
me
.gy-4
ulluqe
.col
me
.gy-4
ulluqe
.col
me
.gy-4
ulluqe
.col
me
.gy-4
ulluqe
.col
me
.gy-4
ulluqe
Me .g-*
klasa, ulluqet në të dy drejtimet mund të rregullohen.
.col
me
.g-3
ulluqe
.col
me
.g-3
ulluqe
.col
me
.g-3
ulluqe
.col
me
.g-3
ulluqe
.col
me
.g-3
ulluqe
.col
me
.g-3
ulluqe
Kontejnerët
Klasat shtesë të shtuara në Bootstrap v4.4 lejojnë kontejnerët që janë 100% të gjerë deri në një pikë të caktuar ndërprerjeje. v5 shton një pikë të re xxl
ndërprerjeje.