Grundläggande rutnätslayouter för att göra dig bekant med att bygga inom Bootstrap-rutnätssystemet.
I dessa exempel .themed-grid-colläggs klassen till i kolumnerna för att lägga till lite teman. Detta är inte en klass som är tillgänglig i Bootstrap som standard.
Det finns fem nivåer i Bootstrap-rutnätssystemet, en för varje serie enheter vi stöder. Varje nivå börjar med en minsta visningsportstorlek och tillämpas automatiskt på de större enheterna om de inte åsidosätts.
Få tre lika breda kolumner från stationära datorer och skala till stora stationära datorer . På mobila enheter, surfplattor och nedan kommer kolumnerna automatiskt att staplas.
Få tre kolumner med början på stationära datorer och skala till stora skrivbord med olika bredder. Kom ihåg att rutnätskolumner bör lägga till upp till tolv för ett enda horisontellt block. Mer än så, och kolumner börjar staplas oavsett visningsport.
Få två kolumner med början på stationära datorer och skala till stora skrivbord .
Inga rutnätsklasser behövs för fullbreddselement.
Enligt dokumentationen är kapsling enkelt – lägg bara en rad med kolumner i en befintlig kolumn. Detta ger dig två kolumner som börjar på skrivbord och skalas till stora skrivbord , med ytterligare två (lika bredder) inom den större kolumnen.
På mobila enheters storlekar, surfplattor och nedåt, staplas dessa kolumner och deras kapslade kolumner.
Bootstrap v4-rutnätssystemet har fem klasser: xs (extra liten, denna klassinfix används inte), sm (small), md (medium), lg (large) och xl (extra large). Du kan använda nästan vilken kombination som helst av dessa klasser för att skapa mer dynamiska och flexibla layouter.
Varje nivå av klasser skalas upp, vilket innebär att om du planerar att ställa in samma bredder för md, lg och xl behöver du bara ange md.
Ytterligare klasser som läggs till i Bootstrap v4.4 tillåter behållare som är 100 % breda fram till en viss brytpunkt.