Heim > Web-Frontend > CSS-Tutorial > So implementieren Sie CSS, um Inhalte automatisch in Webseiten einzubinden

So implementieren Sie CSS, um Inhalte automatisch in Webseiten einzubinden

黄舟
Freigeben: 2016-12-14 16:50:27
Original
1550 Leute haben es durchsucht

Zahlen können dazu führen, dass der Container gedehnt wird und nicht automatisch entsprechend der Größe des Containers umgebrochen wird. Hier erfahren Sie, wie Sie sie mit CSS umbrechen!

Für div

1 (IE-Browser) Leerzeichen:normal; Ersteres folgt hier dem Standard.

#wrap{white-space:normal; width:200px;🎜>oder
#wrap{word-break:break-all;width:200px;}

< ;div id="wrap">ddd1111111111111111111111111

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; }


ddd1111111111111111111111111111111111111

Effekt: Container ist normal, Inhalt ist ausgeblendet

Für Tabelle

1 . (IE-Browser) Verwenden Sie den Stil table-layout:fixed;



< ;td nowrap>abcdefghigklmnopqrstuvwxyz 1234567890



Wirkung: kann

3 Durchsuchen Sie tb{table-layout:fixed}

< ;td nowrap>abcdefghigklmnopqrstuvwxyz 1234567890

abcdefghigklmnopqrstuvwxyz 1234567890


Effekt: Beide tds werden normal umgebrochen

4. (Firefox-Browser) Verwenden Sie die Stile „table-layout:fixed“ und „nowrap“, wenn Sie „Prozentsatz“ verwenden, um die td-Größe festzulegen, und verwenden Sie div



abcdefghigklmnopqrstuvwxyz 1234567890


abcdefghigklm nopqrstuvwxyz 1234567890



The Die Zellenbreite muss hier als Prozentsatz definiert werden

Effekt: normale Anzeige, kann aber nicht umbrochen werden (Hinweis: Es gibt keine gute Möglichkeit, den Inhalt des Containers unter FF zu umbrechen. Sie können den Überlauf nur verwenden, um das Extra auszublenden Inhalt, um eine Beeinträchtigung des Gesamteffekts zu vermeiden)

Bitte beachten Sie weitere verwandte Artikel auf der chinesischen PHP-Website (m.sbmmt.com)!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Empfehlungen
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage