Tipps zum Realisieren des automatischen Zeilenumbruchs beim Erstellen von CSS-Webseiten
Autor：Eve Cole
Aktualisierungszeit：2025-01-15 17:00:16
Tipps zum Realisieren des automatischen Zeilenumbruchs beim Erstellen von CSS-Webseiten Freitag, 6. März 2009 10:47 Uhr Jeder weiß, dass fortlaufendes Englisch oder Zahlen dazu führen können, dass sich der Container ausdehnt und nicht automatisch entsprechend der Größe des Containers umgebrochen wird. Hier erfahren Sie, wie Sie sie umbrechen mit CSS-Methode!
Für div 1. (IE-Browser) folgt das erstere dem Standard. #wrap{white-space:normal; width:200px }
oder
#wrap{word-break:break-all;width:200px;}eg.<div id="wrap">ddd11111111111111111111111111111111</div>Effekt: Zeilenumbruch kann erreicht werden 2. (Firefox-Browser) white-space:normal; word -break:break-all;overflow:hidden; Ebenso gibt es in FF keine gute Implementierungsmethode. Natürlich ist es besser, keine Bildlaufleisten hinzuzufügen. #wrap{white-space:normal; width:200px; overflow:auto;}
oder
#wrap{word-break:break-all;width:200px; overflow:auto; }eg.<div id="wrap">ddd111111111111111111111111111111111</div> Wirkung: Der Container ist normal und der Inhalt ist für Tabelle 1 ausgeblendet. (IE-Browser) verwenden Sie den Stil table-layout:fixed;
zB.<Stil>
.tb{table-layout:fixed}
</style><table class="tbl" width="80">
<tr>
<td>abcdefghigklmnopqrstuvwxyz 1234567890
</td>
</tr>
</table>Effekt: Kann Zeilen 2 umbrechen. (IE-Browser) Verwenden Sie den Stil table-layout: Fixed und nowrapeg.<style>
.tb {table-layout:fixed}
</style><table class="tb" width="80">
<tr>
<td nowrap>abcdefghigklmnopqrstuvwxyz 1234567890
</td>
</tr>
</table>Effekt: kann 3 umbrechen. (IE-Browser) verwenden Sie den Stil table-layout:fixed und nowrap<style>, wenn Sie Prozent verwenden, um die td-Größe festzulegen http://www.knowsky.com/
.tb{table-layout:fixed}
</style><table class="tb" width=80>
<tr>
<td width=25% nowrap>abcdefghigklmnopqrstuvwxyz 1234567890
</td>
<td nowrap>abcdefghigklmnopqrstuvwxyz 1234567890
</td>
</tr>
</table> Wirkung: Beide tds werden normal umbrochen. 3. (Firefox-Browser) Wenn Sie „Prozent“ verwenden, um die td-Größe festzulegen, verwenden Sie die Stile „table-layout: Fixed“ und „nowrap“ sowie „diveg.<style>“.
.tb {table-layout:fixed}
.td {overflow:hidden;}
</style><table class=tb width=80>
<tr>
<td width=25% class=td nowrap>
<div>abcdefghigklmnopqrstuvwxyz 1234567890</div>
</td>
<td class=td nowrap>
<div>abcdefghigklmnopqrstuvwxyz 1234567890</div>
</td>
</tr>
</table> Die Zellenbreite muss hier in Prozent angegeben werden. Der Effekt ist: normale Anzeige, aber kein Zeilenumbruch (Hinweis: Es gibt keine gute Möglichkeit, den Containerinhalt unter FF zu umbrechen. Sie können den Überlauf nur verwenden, um das Extra auszublenden Inhalte, die vermieden werden sollten, beeinflussen den Gesamteffekt)
