Bootstrap 4 Farben
Textfarben
Bootstrap 4 verfügt über einige kontextabhängige Klassen, die verwendet werden können, um "Bedeutung durch Farben" bereitzustellen.
Die Klassen für Textfarben sind: .text-muted
,
.text-primary
, .text-success
, .text-info
,
.text-warning
, .text-danger
, .text-secondary
, .text-white
,
.text-dark
, .text-body
(Standard-Körperfarbe/häufig schwarz) und .text-light
:
Beispiel
This text is muted.
This text is important.
This text indicates success.
This text represents some information.
This text represents a warning.
This text represents danger.
Secondary text.
Dark grey text.
Body text.
Light grey text.
Kontextuelle Textklassen können auch für Links verwendet werden, wodurch eine dunklere Hover-Farbe hinzugefügt wird:
Beispiel
Sie können mit den Klassen .text-black-50
oder auch 50 % Deckkraft für schwarzen oder weißen Text hinzufügen :.text-white-50
Beispiel
Black text with 50% opacity on white background
White text with 50% opacity on black background
Hintergrundfarben
Die Klassen für Hintergrundfarben sind: .bg-primary
,
.bg-success
, .bg-info
, .bg-warning
, .bg-danger
, .bg-secondary
, .bg-dark
und .bg-light
.
Beachten Sie, dass Hintergrundfarben nicht die Textfarbe festlegen, sodass Sie sie in einigen Fällen zusammen mit einer .text-*
Klasse verwenden möchten.
Beispiel
This text is important.
This text indicates success.
This text represents some information.
This text represents a warning.
This text represents danger.
Secondary background color.
Dark grey background color.
Light grey background color.