Ausführliche Erklärung und Beispiele für die Verwendung des Zeilenumbruch-Attributs in CSS3

Wir alle wissen, dass das Zeilenumbruch Attribut ein neues Attribut von CSS3 ist, daher wird in diesem Artikel ausführlich erläutert, wie das Zeilenumbruch-Attribut und das Attribut. 🎜>Notizen, schauen wir uns unten ein kleines Beispiel an.

1. Definition

Word-Wrap-Attribut ermöglicht das Umbrechen langer Wörter oder URL-Adressen in die nächste Zeile.

2. Syntax und Parameter

Wortumbruch: normal (Standard) | long verlässt die Grenze (wird in der aktuellen Zeile ohne Umbruch angezeigt). break-word: Der Inhalt wird innerhalb der Grenze umgebrochen, wenn das Wort nicht in die aktuelle Zeile passt, wird bei Bedarf automatisch

word-break ausgelöst (Hinweis: bitte). Die Unterscheidung zwischen Wortumbruch und Wortumbruch sind zwei verschiedene Dinge, das eine ist ein Attribut und das andere ein Parameter. Hinweis: Alle Browser können es erkennen. 3. Beschreibung

Wortumbruch steuert, ob „Zeilen für Wörter umgebrochen“ werden und legt fest oder ruft ab, ob Zeilen umgebrochen werden, wenn die aktuelle Zeile die Grenze des angegebenen Containers überschreitet. Es gibt kein Problem mit chinesischen Sätzen und es gibt kein Problem mit englischen Sätzen. Aber für lange Englischzeilen funktioniert es nicht.

Beispiel

Das Wort „congratulation“ gehört zu einer langen Zeichenfolge von englischen Wörtern: break-word behandelt das gesamte Wort als Ganzes Breit genug, um das gesamte Wort anzuzeigen, wird es automatisch angezeigt. Das Einfügen des gesamten Worts in die nächste Zeile, ohne das Wort abzuschneiden, ist der Grund, warum es bei langen Textzeichenfolgen nicht funktioniert. word-wrap:normal ist die Standardeinstellung und englische Wörter werden nicht geteilt.

5. Zusammenfassung

Der Gültigkeitsbereich umfasst nur Standardelemente auf Blockebene wie div. Tabellenelemente wie th und td werden erkannt, haben jedoch keine Auswirkung (wenn td, th plus width word). Wrap kann unter IE effektiv sein, aber aus Sicht der vollständigen Kompatibilität und des praktischen Speichers hat die vorherige Schlussfolgerung Vorrang.

Ich glaube, dass Sie die Methoden beherrschen, nachdem Sie diese Fälle gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!

Verwandte Lektüre:

So ändern Sie den Mouseover-Stil ohne Verwendung von CSS

Die Gründe und Lösungen für die Verschiebung von HTML-Webseiten

Js-Prozess zum Betreiben von DOM-Objekten

Das obige ist der detaillierte Inhalt vonAusführliche Erklärung und Beispiele für die Verwendung des Zeilenumbruch-Attributs in CSS3. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!