Heim > Web-Frontend > CSS-Tutorial > Wie kann ich den Text in einer Tabellenzelle umbrechen?

Wie kann ich den Text in einer Tabellenzelle umbrechen?

Susan Sarandon
Freigeben: 2024-10-27 02:32:30
Original
479 Leute haben es durchsucht

How can I make text wrap in a table cell?

Wie kann ich erzwingen, dass der Text in einer Tabellenzelle () umbrochen wird?

Standardmäßig wird Tabellenzellentext nicht automatisch in die nächste Zeile umgebrochen, was dazu führt, dass Text außerhalb der Zelle überläuft und sich auf das Layout der Seite auswirkt.

So erzwingen Sie den Zeilenumbruch< /h3>

Es gibt zwei Hauptmethoden, um den Textumbruch in Tabellenzellen zu erzwingen:

1. Verwenden Sie table-layout:fixed und word-wrap:break-word

Dadurch wird ein festes Layout für die Tabelle festgelegt und Erzwingt, dass der Text innerhalb der Breite der Zelle in mehrere Zeilen aufgeteilt wird. Es funktioniert in modernen Browsern.

<br>Tabelle {<br> Tabellenlayout: behoben;<br>}</p>
<p>td {<br> Zeilenumbruch: break-word;<br>}<br>

2. Verwenden Sie white-space: normal

Dadurch wird der Browser angewiesen, Zellentext als normalen Text zu behandeln, sodass er auf natürliche Weise umbrochen werden kann. Es funktioniert jedoch möglicherweise nicht in allen Browsern.


td {
white-space: normal;
}

Überlegungen

Abhängig von Ihrem Seitenlayout müssen Sie möglicherweise auch die Breite der Tabelle oder Zelle anpassen, um sicherzustellen, dass der Text umbrochen wird wie gewünscht.

Außerdem kann es aufgrund der Dynamik dazu kommen, dass der Zellentext den Container überläuft, wenn er sich in einem flexiblen Container befindet, z. B. einem Div mit einer prozentualen Breite Art des Layouts.

Das obige ist der detaillierte Inhalt vonWie kann ich den Text in einer Tabellenzelle umbrechen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage