Wie kann ich einen browserübergreifenden Zeilenumbruch in Divs erreichen?

Browserübergreifender Zeilenumbruch in Divs

Frage:

Ist das möglich? Zeilenumbruch für lange Wörter innerhalb eines Div, um eine browserübergreifende Funktion zu gewährleisten Kompatibilität?

Antwort:

Ja, es ist möglich, mithilfe des folgenden CSS-Codes einen browserübergreifenden Zeilenumbruch zu erreichen:

.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 :

Die .wordwrap-Klasse nutzt mehrere CSS-Eigenschaften, um den Zeilenumbruch in unterschiedlichen Formaten sicherzustellen Browser:

• white-space: pre-wrap unterbricht Wörter zwischen Zeilen, ohne zusätzliche Leerzeichen hinzuzufügen, eine Funktion, die in modernen Browsern unterstützt wird.
• -moz-pre-wrap und -o- pre-wrap sind herstellerpräfixierte Alternativen für Mozilla Firefox bzw. Opera.
• -pre-wrap funktioniert ähnlich in Opera-Versionen davor 7.
• Wortumbruch: break-word erzwingt Wortumbrüche im Internet Explorer.

Durch die Kombination dieser Eigenschaften können Sie lange Wörter innerhalb eines Divs in verschiedenen Browsern effektiv umbrechen.

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