Ich verwende einen HTML-Code <table>
und möchte den Text <td>
in jeder Zelle an der Mitte ausrichten .
Wie zentriere ich den Text horizontal und vertikal?
Ich verwende einen HTML-Code <table>
und möchte den Text <td>
in jeder Zelle an der Mitte ausrichten .
Wie zentriere ich den Text horizontal und vertikal?
Antworten:
Hier ist ein Beispiel mit CSS- und Inline- style
Attributen:
td
{
height: 50px;
width: 50px;
}
#cssTable td
{
text-align: center;
vertical-align: middle;
}
<table border="1">
<tr>
<td style="text-align: center; vertical-align: middle;">Text</td>
<td style="text-align: center; vertical-align: middle;">Text</td>
</tr>
</table>
<table border="1" id="cssTable">
<tr>
<td>Text</td>
<td>Text</td>
</tr>
</table>
BEARBEITEN : Das valign
Attribut ist in HTML5 veraltet und sollte nicht verwendet werden.
Long Hand Inline Beispiel:
<td style='text-align:center;vertical-align:middle'></td>
Kurzschrift CSS-Beispiel:
td{
text-align:center;
vertical-align:middle;
}
<td align="center" valign="center">textgoeshere</td>
Ist die einzig richtige Antwort imho, da Sie mit Tabellen arbeiten, die alte Funktionalität, die am häufigsten für die E-Mail-Formatierung verwendet wird. Daher ist es am besten, nicht nur Stil, sondern auch Inline-Stil und bekannte Tabellen-Tags zu verwenden.
valign
ist in HTML5 veraltet. Benutze es nicht. Für die E-Mail-Formatierung ist ein style
Tag oder ein Inline- style
Attribut die beste Lösung.
Selektor> Kind:
.text-center-row>th,
.text-center-row>td {
text-align: center;
}
<table border="1" width='500px'>
<tr class="text-center-row">
<th>Text</th>
<th>Text</th>
<th>Text</th>
<th>Text</th>
</tr>
<tr>
<td>Text</td>
<td>Text</td>
<td>Text</td>
<td>Text</td>
</tr>
<tr class="text-center-row">
<td>Text</td>
<td>Text</td>
<td>Text</td>
<td>Text</td>
</tr>
</table>
<td align="center"valign="center">textgoeshere</td>
vertical-align:middle
auf dastr
Element angewendet werden ?