Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Lernen Typografie Teil 2 | Grundkonzepte
Bootstrap-Grundlagen für Moderne Websites
course content

Kursinhalt

Bootstrap-Grundlagen für Moderne Websites

Bootstrap-Grundlagen für Moderne Websites

1. Verständnis von Bootstrap
2. Einrichtung der Umgebung
3. Grundkonzepte
4. Fortgeschrittene Konzepte
5. Erstellen Einer Portfolio-Website Mit Bootstrap

book
Typografie Teil 2

Textfarbe

Bootstrap bietet eine Reihe von Dienstprogrammen-Klassen, um vordefinierte Textfarben auf Elemente anzuwenden.

  • text-primary: Setzt die Textfarbe auf eine Primärfarbe, typischerweise ein Blauton;
  • text-secondary: Setzt die Textfarbe auf eine Sekundärfarbe, oft ein Grauton;
  • text-success: Setzt die Textfarbe, um Erfolg anzuzeigen, typischerweise ein Grünton;
  • text-danger: Setzt die Textfarbe, um Gefahr oder Fehler anzuzeigen, oft ein Rotton;
  • text-warning: Setzt die Textfarbe, um eine Warnung anzuzeigen, normalerweise ein Gelbton;
  • text-info: Setzt die Textfarbe, um Informationen zu vermitteln, oft ein Cyan- oder Tealton;
  • text-light: Setzt die Textfarbe auf einen helleren Ton, typischerweise hellgrau oder weiß;
  • text-dark: Setzt die Textfarbe auf einen dunkleren Ton, typischerweise dunkelgrau oder schwarz;
  • text-muted: Setzt die Textfarbe auf einen gedämpften oder abgeschwächten Ton, oft ein hellgrau, um anzuzeigen, dass der Text weniger wichtig oder deaktiviert ist.

Diese Klassen können auf Elemente wie <p>, <span>, <div>, <h> usw. angewendet werden.

html

index.html

copy

Texttransformation

Klassen wie text-uppercase, text-lowercase, und text-capitalize transformieren den Text.

  • text-uppercase: Wandelt den Text in Großbuchstaben um;
  • text-lowercase: Wandelt den Text in Kleinbuchstaben um;
  • text-capitalize: Kapitalisiert den ersten Buchstaben jedes Wortes im Text.
html

index.html

copy

Textdekoration

Klassen wie text-decoration-underline, text-decoration-line-through und text-decoration-none werden verwendet, um Text zu dekorieren.

  • text-decoration-underline: Fügt dem Text eine Unterstreichung hinzu;
  • text-decoration-line-through: Fügt dem Text eine Durchstreichung hinzu;
  • text-decoration-none: Entfernt alle Textdekorationen.
html

index.html

copy

War alles klar?

Wie können wir es verbessern?

Danke für Ihr Feedback!

Abschnitt 3. Kapitel 3
We're sorry to hear that something went wrong. What happened?
some-alt