Wie kann ich Text in einer Tabelle mithilfe von Bootstrap-CSS-Klassen ausrichten?

So richten Sie Text in einer Tabelle mithilfe von CSS-Klassen aus

Das Bootstrap-Framework von Twitter bietet einen robusten Satz von CSS-Klassen zum Ausrichten von Text in HTML-Elementen . Diese Klassen können auf Tabellenelemente angewendet werden, um die gewünschte Ausrichtung zu erreichen.

Bootstrap 3

Für Bootstrap 3 können die folgenden Klassen verwendet werden, um Text innerhalb von Tabellenzellen auszurichten :

• .text-left: Linksbündiger Text
• .text-center: Mittenbündiger Text
• .text-right: Rechtsbündiger Text

Beispiel:

<code class="html"><th class="text-right">Total</th>
<td class="text-right">,000,000.00</td></code>

Bootstrap 4

Bootstrap 4 führt eine detailliertere Kontrolle über die Textausrichtung ein und ermöglicht so Sie können unterschiedliche Ausrichtungen für unterschiedliche Ansichtsfenstergrößen angeben. Die folgenden Klassen sind verfügbar:

• .text-xs-left: Linksbündiger Text in allen Ansichtsfenstergrößen
• .text-xs-center: Mittig ausgerichteter Text in allen Ansichtsfenstern Größen
• .text-xs-right: Rechtsbündiger Text in allen Ansichtsfenstergrößen
• .text-sm-left: Linksbündiger Text in Ansichtsfenstern der Größe SM (klein) oder breiter
• .text-md-left: Linksbündiger Text in Ansichtsfenstern mit der Größe MD (mittel) oder größer
• .text-lg-left: Linksbündiger Text in Ansichtsfenstern mit der Größe LG (groß) oder größer
• .text-xl-left: Linksbündiger Text in Ansichtsfenstern der Größe XL (extragroß) oder breiter

Bootstrap 5

In Bootstrap 5 wurde .text-left durch .text-start und .text-right durch .text-end ersetzt. Ansonsten bleiben die Ausrichtungsoptionen gleich.

Das obige ist der detaillierte Inhalt vonWie kann ich Text in einer Tabelle mithilfe von Bootstrap-CSS-Klassen ausrichten?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!