css 強制改行 IE、Firefox 改行

div や p などのブロックレベルの要素の場合、

通常のテキスト行の折り返し (アジアのテキストと非アジアのテキスト) 要素にはデフォルトのwhite-space:normal があり、定義された幅の後で自動的に折り返されます:

html

通常のテキストの折り返し (アジア言語のテキストと非アジア言語のテキスト) 要素は、定義されている場合、デフォルトのwhite-space:normal になります

css

#wrap- space:normal; width :200px; }

1. (IE ブラウザ) 連続した英語文字とアラビア数字の場合は、word-wrap:break-word または word-break:break-all; を使用します。

#wrap {word-break:break-all; width:200px;}

または

#wrap{word-wrap:break-word; width:200px;}

abcdefghijklmnabcdefghijklmnabcdefghijklmn11111111 1

効果: 改行を実現できます

2. (Firefox ブラウザ) 連続した英語文字とアラビア数字が壊れています。Firefox のすべてのバージョンではこの問題は解決できません。私たちだけで解決できます。境界を越える文字を非表示にするか、コンテナにスクロールバーを追加します

#wrap{word-break:break-all; width:200px; overflow:auto;}

効果: コンテナは通常、コンテンツは非表示になります

テーブルの場合

1. (IE ブラウザ) table-layout:fixed; を使用してテーブルの幅を強制すると、余分なコンテンツが非表示になります

abcdefghigklmnopqrstuvwxyz 1234567890

< ;/td>

4. (Firefox ブラウザ) table-layout:fixed; を使用して、テーブル、内部 TD、行を折り返すために word-break:break-all; または word-wrap:break-word; を使用します。ここでは overflow:auto は機能しません。

abcdefghigklmnopqrstuvwxyz1234567890

効果: コンテンツ以外を非表示にする

5. (Firefox ブラウザ) td,th に埋め込み、div、p などを設定し、上記の方法を使用して Firefox を処理しますコードボックスを実行します。最後に、これが起こる可能性は非常に低いです。

声明：

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

続きを見る

関連記事