Heim > Artikel > Web-Frontend > Wie richtet man Text in Tabellenzellen in HTML zentriert aus?
Wie richtet man Text in Tabellenzellen in HTML zentriert aus?
- PHPznach vorne
- 2023-09-10 10:09:062760Durchsuche
Wir verwenden die CSS-Eigenschaft text-align, um Text in Tabellenzellen zentriert auszurichten. Wir verwenden ein internes Inline-Stylesheet, um Text in Tabellenzellen auszurichten.
Die text-align-Eigenschaft von CSS legt die Ausrichtung des Inhalts in
Standardmäßig ist der Inhalt von
Wir können den Ausrichtungswert auch nach links und rechts ändern.
Grammatik
Das Folgende ist die Syntax zum zentrierten Ausrichten von Text im
<th style="text-align: center">Table header...</th>
Das Folgende ist die Syntax für die zentrierte Ausrichtung von Text in einem
<td style="text-align: center">Table header...</td>
Beispiel 1
Nachfolgend finden Sie ein Beispiel für die zentrierte Ausrichtung von Text in einer Tabellenzelle in HTML.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
table,tr,th,td {
border:1px solid black;
}
</style>
</head>
<body>
<table style="width: 50%">
<caption style="text-align: center; ">Employees</caption>
<tr>
<th style="text-align: center">EmployeeName</th>
<th style="text-align: center">EmployeeId</th>
</tr>
<tr>
<td style="text-align: center">Yadav</td>
<td style="text-align: center">022</td>
</tr>
<tr>
<td style="text-align: center">Abdul</td>
<td style="text-align: center">025</td>
</tr>
<tr>
<td style="text-align: center">Jason</td>
<td style="text-align: center">208</td>
</tr>
</table>
</body>
</html>
Das Folgende ist die Ausgabe des obigen Beispielprogramms.
Beispiel 2
Schauen wir uns ein weiteres Beispiel an, um dies zu veranschaulichen –
<!DOCTYPE html>
<html>
<head>
<style>
table, td, th {
border: 1px solid black;
width: 300px;
}
</style>
</head>
<body>
<h1>Authors</h1>
<table>
<tr>
<th>Alchemist</th>
<th>Rich Dad Poor Dad</th>
</tr>
<tr>
<td style="text-align:center">Paulo Coelho</td>
<td style="text-align:center">Robert Kiyosaki</td>
</tr>
</table>
</body>
</html>
Das obige ist der detaillierte Inhalt vonWie richtet man Text in Tabellenzellen in HTML zentriert aus?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!