So legen Sie Text über den Zeilenumbruch hinaus in HTML fest

In HTML können Sie die Attribute „word-wrap“, „word-break“ und „overflow“ verwenden, um den Text über den Zeilenumbruch hinaus festzulegen. Fügen Sie einfach „word-wrap:break-word;word-break:break-all;overflow:“ hinzu. „hidden;“-Stil zum Textelement hinzufügen. .

Die Betriebsumgebung dieses Tutorials: Windows7-System, CSS3- und HTML5-Version, Dell G3-Computer.

Ich bin heute auf ein Problem gestoßen, wie im Bild gezeigt:

Dadurch sieht der Effekt sehr unansehnlich aus. Unser Idealzustand sollte darin bestehen, dass der Inhalt im Div die Breite des Div überschreitet und der Inhalt sollte in neuen Zeilen angezeigt werden.

Lösung:

Zuerst müssen wir sicherstellen, dass das Div eine Breite hat, und dann den CSS-Stil hinzufügen: Der Code lautet wie folgt:

word-wrap:break-word; 
word-break:break-all; 
overflow: hidden;

Das Ergebnis ist wie folgt:

So erzielen wir den gewünschten Effekt.

Empfohlenes Tutorial: „HTML-Video-Tutorial“

Das obige ist der detaillierte Inhalt vonSo legen Sie Text über den Zeilenumbruch hinaus in HTML fest. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!