Wie kann ich die Spaltenbreite einer Tabelle in HTML unabhängig von der Länge des Zelleninhalts beibehalten?

Tabellenspaltenbreite trotz Länge des Zelleninhalts beibehalten

In tabellarischen Darstellungen ist es oft wünschenswert, unabhängig vom Text eine konsistente Spaltenbreite beizubehalten Länge innerhalb seiner Zellen. Das Standardverhalten von HTML-Tabellen ermöglicht jedoch eine Erweiterung der Spaltenbreite, um längere Inhalte aufzunehmen.

Um diese automatische Erweiterung zu deaktivieren und eine feste Spaltenbreite sicherzustellen, führen Sie die folgenden Schritte aus:

1. Geben Sie die gewünschte Spaltenbreite mit der Eigenschaft width für die Elemente th (Tabellenüberschriften) und td (Tabellendaten) innerhalb der entsprechenden Spalte an. Zum Beispiel:

th, td {
  width: 100px;
}

2. Setzen Sie die Tabellenlayouteigenschaft der Tabelle auf „fest“, wodurch der Browser angewiesen wird, die angegebenen Spaltenbreiten zu erzwingen:

table {
  table-layout: fixed;
}

3. Um zu verhindern, dass ein möglicher Textüberlauf über die Tabelle hinausgeht, fügen Sie den Überlauf hinzu: versteckt; Eigenschaft für die Elemente th und td:

th, td {
  overflow: hidden;
}

4. Stellen Sie sicher, dass alle Rahmen und Größen für die Tabelle und ihre Zellen mithilfe von CSS und nicht mit HTML-Attributen definiert werden.

Indem Sie diese Schritte befolgen, können Sie eine konstante Spaltenbreite in Ihren HTML-Tabellen beibehalten, unabhängig von der Textlänge in einzelnen Zellen.

Das obige ist der detaillierte Inhalt vonWie kann ich die Spaltenbreite einer Tabelle in HTML unabhängig von der Länge des Zelleninhalts beibehalten?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!