Volle Breite mit der CSS-Klasse „container-fluid“
1920px mit der CSS-Klasse „container-1920“
1600px mit der CSS-Klasse „container-1600“
1440px mit der CSS-Klasse „container-1440“
1280px mit der CSS-Klasse „container-1280“
1170px mit der CSS-Klasse „container-1170“
920px mit der CSS-Klasse „container-920“
Grids (CSS-Klasse "grid-xxx") z.B. grid-50-50 oder grid-33-33-33
50
50
66
33
33
66
75
25
25
75
33
33
33
25
25
25
25
20
20
20
20
20
Hintergrundfarben
Die Hintergrundfarben können zum einen über den Inspektor ausgewählt werden, zum anderen über folgende CSS-Klassen:
CSS-Klasse „bg-primary“
CSS-Klasse „bg-primary-gradient“
CSS-Klasse „bg-secondary“
CSS-Klasse „bg-secondary-gradient“
CSS-Klasse „bg-gray“
CSS-Klasse „bg-lightgray“
Hintergrundbilder
CSS-Klassen „container-fluid container-background-image“ im umgebenden Section-Element. Für Die Desktop-Ansicht und die Mobile-Ansicht können zwei unterschiedliche Bilder eingefügt werden, die jeweils über die CSS-Klassen „img-desktop“ und „img-mobile“ ein- bzw- ausgeblendet werden.
Die Positionierung der Caption erfolgt über diese CSS-Klassen: „align-top-left“, „align-top-center“, „align-top-right“, „align-center-left“, „align-center-center“, „align-center-right“, „align-bottom-left“, „align-bottom-center“, „align-bottom-right“.


Lorem ipsum dolor sit amet
Lorem ipsum dolor sit
Parallaxe Hintergrundbilder
Um dem Hintergrund-Bild einen Parallax-Effekt hinzuzufügen, wird die CSS-Klasse „container-parallax“ beim umgebenden Section-Element ergänzt. Mit der Bildausrichtung (Mitte, Rechts) kann die Positionierung etwas beinflusst werden.


Mit der SWM auf der Überholspur
Lorem ipsum dolor sit


Lorem ipsum dolor sit amet
Lorem ipsum dolor sit