Standardcontainer lassen links und rechts Platz

Hello, world!

Bootstrap-Inhalte werden in Container gegliedert.

Margin: Außenabstand Der Margin wird in Bootstrap über die Klasse m gesteuert. Je "Richtung" kann ein Wert von 0 bis 5 angegeben werden.

Die Paddings werden genau so gestezt, nur mit einem p als Präfix.S

Fließender Container

Fließende Container nehmen die volle Breite des Viewports ein.

Responsive Container

Responsive Container nehmen 100% der Breite ein, bis ein bestimmter breakpoint erreicht ist. Danach werden sie in der Breite reduziert dargestellt.
100% breit bis zum sm-Breakepoint
100% breit bis zum md-Breakepoint
100% breit bis zum lg-Breakepoint
100% breit bis zum xl-Breakepoint
100% breit bis zum xxl-Breakepoint

Das Grid-System

Container lassen sich in einem 12-spaltigen Grid-system layauten/ anordnen.
.col restliche Fläche
.col-6 (6/12)
.col-2 (2/12)
.col-1
.col restliche Fläche
.col-4
.col-1
.col-1

Aufgabe

Erstelle Sie eine Übersicht über die vorhandenen Vorder und Hintergrundfarben in dem Sie diese als Container in einem Grid anordnen.

Hintergrundfarben

Hintergrundfarben

Primary
Secondary
Success
Danger
Warning
Info
Dark

Schriftfarbe

Primary
Secondary
Success
Danger
Warning
Info
Dark

Navbar

Navigationsleisten sind Berreiche mit Links, die meist oben auf der Webseite dargestellt werden und die Navigation der zwischen den Unterseiten oder versch. Bereichen einer Webseite dienen.
Bootstrap-Navbars können in Abhängigkeit vom Viewport zwischen horizontaler, vertikaler und Hamburger-Darstellung wechseln.
Eine Navbar wird immer in ein Container-Div gepackt. Diesem wird die Klasse .navbar zugeordnet.
Zusätzlich sollte eine responsive Klasse verwendet werden z.B. container-fluid.