Div でクロスブラウザーのワードラッピングを実現するにはどうすればよいですか?

Div でのクロスブラウザーのワードラッピング

質問:

は実現可能ですか? div 内の長い単語をワードラップし、クロスブラウザーを保証します。互換性?

答え:

はい、次の CSS コードを使用してクロスブラウザーのワード ラッピングを実現できます:

.wordwrap {
   white-space: pre-wrap;      /* CSS3 */
   white-space: -moz-pre-wrap; /* Firefox */
   white-space: -pre-wrap;     /* Opera <7 */
   white-space: -o-pre-wrap;   /* Opera 7 */
   word-wrap: break-word;      /* IE */
}

説明:

.wordwrap クラスは複数の CSS プロパティを利用して、さまざまな形式でワード ラッピングを保証します。ブラウザ:

• 空白: pre-wrap は余分なスペースを追加せずに行間の単語を区切ります。これは最新のブラウザでサポートされている機能です。
• -moz-pre-wrap および -o- pre-wrap は、それぞれ Mozilla Firefox と Opera のベンダープレフィックス付きの代替手段です。
• -pre-wrap は、以前の Opera バージョンでも同様に機能します。 7.
• word-wrap: Break-word は Internet Explorer で強制的に単語を区切ります。

これらのプロパティを組み合わせることで、さまざまなブラウザーで div 内の長い単語を効果的にラップできます。

以上がDiv でクロスブラウザーのワードラッピングを実現するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。