css-Zeilenumbruchcode: 1. Die Anweisung „word-break: break-word;word-break: normal;“ kann einen automatischen Zeilenumbruch realisieren; Englischer Wortzeilenumbruch.
Die Betriebsumgebung dieses Tutorials: Windows7-System, CSS3- und HTML5-Version, Dell G3-Computer. „Mehrere Möglichkeiten, Zeilen in CSS umzubrechen.“ Leerraumattribut
Einstellungen für Leerzeichenattribute Wie mit Leerzeichen innerhalb von Elementen umgegangen wird. Dieses Attribut legt fest, wie mit Leerzeichen in Elementen während des Layoutprozesses umgegangen wird.
Syntax:
div{ word-wrap: break-word; word-break: normal; }
normal: Standard. Leerzeichen werden vom Browser ignoriert.
pre: Leerzeichen werden vom Browser beibehalten. Es verhält sich wie das
-Tag in HTML. </p><p></p><p>nowrap: Der Text wird nicht umgebrochen, der Text wird in derselben Zeile fortgesetzt, bis das Tag <br> gefunden wird. </p><p></p><p>Pre-Wrap: Leerzeichensequenzen beibehalten, Zeilen aber normal umbrechen. </p><p></p><ul style="list-style-type: disc;">Vorzeile: Leerzeichensequenzen zusammenführen, aber Zeilenumbrüche beibehalten. <li><p></p></li>2. Zeilenumbruch-Attribut <li><p>Das Zeilenumbruch-Attribut ermöglicht das Umbrechen langer Wörter oder URL-Adressen in die nächste Zeile. </p></li>Syntax<li><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:css;toolbar:false"> div{ word-break:break-all; }
Attributwert:
normal: Nur Zeilenumbrüche an zulässigen Silbentrennungspunkten (Browser behält die Standardverarbeitung bei).
break-word: Umbrechen Sie Zeilen innerhalb langer Wörter oder URL-Adressen.
3. Wortumbruch-Attribut
Das Wortumbruch-Attribut gibt die Verarbeitungsmethode des automatischen Zeilenumbruchs an. Syntaxdiv{ white-space:nowrap; }
keep-all: Nur Zeilenumbrüche bei Leerzeichen halber Breite oder Bindestrichen.
(Lernvideo-Sharing:
CSS-Video-Tutorial)
Das obige ist der detaillierte Inhalt vonWas ist der CSS-Zeilenumbruchcode?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!