すべてのブラウザーで表のセルでテキストの折り返しを確実に行うにはどうすればよいですか?

表のセル内でテキストを折り返すための CSS

表のセル内のテキストを折り返す必要がある場合は、ブラウザーの互換性を考慮することが重要です。 word-break:break-all;の使用中。およびテーブル レイアウト: 固定。 Chrome では十分ですが、Firefox では期待通りに動作しない可能性があります。

ブラウザ間の互換性

このブラウザ互換性の問題に対処するには、より包括的な CSS ソリューションを使用できます。採用:

.wrapword {
    white-space: -moz-pre-wrap !important;  /* Mozilla, since 1999 */
    white-space: -webkit-pre-wrap;          /* Chrome & Safari */
    white-space: -pre-wrap;                 /* Opera 4-6 */
    white-space: -o-pre-wrap;               /* Opera 7 */
    white-space: pre-wrap;                  /* CSS3 */
    word-wrap: break-word;                  /* Internet Explorer 5.5+ */
    word-break: break-all;
    white-space: normal;
}

この CSS は、さまざまなブラウザーでテキストが適切に折り返されることを保証します。表のセルにラップワード クラスを適用すると、テキストは不要な空白なしで自動的に改行されます。

<table>

この手法を使用すると、表のセル内のテキストを効果的に折り返すことができ、ブラウザ間の互換性を維持できます。

以上がすべてのブラウザーで表のセルでテキストの折り返しを確実に行うにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。