Wie erreicht man einen browserübergreifenden Zeilenumbruch in HTML-Divs?

Browserübergreifender Zeilenumbruch von langen Texten in Divs

Frage:

Wie können Sie browserübergreifend implementieren? Zeilenumbruch für lange Zeichenfolgen in HTML divs?

Antwort:

Um den Zeilenumbruch in verschiedenen Browsern sicherzustellen, können die folgenden CSS-Eigenschaften verwendet werden:

.wordwrap {
   white-space: pre-wrap;      /* CSS3 */
   white-space: -moz-pre-wrap; /* Firefox */
   white-space: -pre-wrap;     /* Opera <7 */
   white-space: -o-pre-wrap;   /* Opera 7 */
   word-wrap: break-word;      /* IE */
}

Erklärung:

• Leerzeichen: pre-wrap: Browser ohne spezielle Unterstützung für Zeilenumbrüche brechen Zeilen an Leerzeichengrenzen um.
• white-space: -moz-pre-wrap: Firefox-spezifische Eigenschaft zur Aktivierung Pre-Wrap-Verhalten.
• white-space: -pre-wrap: Ältere Opera-Versionen vor 7.
• Leerzeichen: -o-pre-wrap: Opera 7.
• Wortumbruch: break-word: IE- Spezifische Eigenschaft zum Umbrechen von Wörtern an Silbentrennungspunkten.

Durch die Kombination dieser Eigenschaften wird der Text innerhalb des Div mit dem Die Klasse „wordwrap“ bricht an jeder Zeichenumbruchstelle um und gewährleistet so die browserübergreifende Kompatibilität.

Das obige ist der detaillierte Inhalt vonWie erreicht man einen browserübergreifenden Zeilenumbruch in HTML-Divs?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!