Heim > Artikel > Web-Frontend > So stellen Sie den automatischen Zeilenumbruch in CSS ein
So stellen Sie den automatischen Zeilenumbruch in CSS ein
- coldplay.xixiOriginal
- 2021-03-02 10:52:5012101Durchsuche
So richten Sie den automatischen Zeilenumbruch in CSS ein: Verwenden Sie das Attribut [word-break], um dem Browser zu ermöglichen, eine Zeile an jeder Position umzubrechen. Der Code ist [.p3{width:200px;border:1px solid #ccc;word -break:break- all].
Die Betriebsumgebung dieses Tutorials: Windows 7-System, CSS3- und HTML5-Version, DELL G3-Computer.
So richten Sie den automatischen Zeilenumbruch in CSS ein:
Automatischer Zeilenumbruch: Mithilfe des Attributs word-break können Sie dem Browser erlauben, Zeilen an jeder Position umzubrechen. word-break属性，可以让浏览器实现在任意位置换行
它有三个属性值分别为：
normal： 浏览器中的默认换行行为break-all：可允许在单词内换行-
Es gibt drei Attributwerte:keep-all -
break- all: Zeilenumbrüche innerhalb von Wörtern sind erlaubt -
keep-all: Zeilenumbrüche können nur an Leerzeichen halber Breite oder Bindestrichen vorgenommen werden
🎜 🎜🎜🎜🎜Verwandte Tutorial-Empfehlungen: 🎜CSS-Video-Tutorial🎜🎜🎜<style> .p1{ width:200px; border:1px solid #ccc; word-break:normal; } .p2{ width:200px; border:1px solid #ccc; word-break:keep-all; } .p3{width:200px; border:1px solid #ccc; word-break:break-all; } </style> </head> <body> <p class="p1">Php Chinese website provides a large number of free, original, high-definition php video tutorials.</p> <p class="p2">Php Chinese website provides a large number of free, original, high-definition php video tutorials.</p> <p class="p3">Php Chinese website provides a large number of free, original, high-definition php video tutorials.</p> </body>Rendering:
normal: Das standardmäßige Zeilenumbruchverhalten in Browsern
Das obige ist der detaillierte Inhalt vonSo stellen Sie den automatischen Zeilenumbruch in CSS ein. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!