ホームページ > ウェブフロントエンド > CSSチュートリアル > 表のセル内でテキストを折り返すにはどうすればよいですか?

表のセル内でテキストを折り返すにはどうすればよいですか?

Susan Sarandon
リリース: 2024-10-27 02:32:30
オリジナル
480 人が閲覧しました

How can I make text wrap in a table cell?

表のセル () 内のテキストを強制的に折り返すにはどうすればよいですか?

デフォルトでは、表のセルのテキストは次の行に自動的に折り返されないため、テキストがセルの外にはみ出してページのレイアウトに影響を与えます。



/h3>

表のセルのテキストの折り返しを強制するには、主に 2 つの方法があります:


1.
table-layout:fixed

word-wrap:break-word

を使用します。これにより、テーブルの固定レイアウトが設定され、テキストをセルの幅内で強制的に複数行に分割します。最新のブラウザで動作します。

</p>table {<p> table-layout: fixed;<br>}<br><br>td {<br>ワードラップ: ブレークワード;</p>}<p>

2.

white-space:normal

を使用します。これにより、セルのテキストを通常のテキストとして扱うようにブラウザーに指示され、自然に折り返されるようになります。ただし、すべてのブラウザで動作するとは限りません。

td { White-space:normal;}<🎜>

考慮事項

ページ レイアウトによっては、テキストが折り返されるように表またはセルの幅を調整する必要がある場合もあります。

さらに、テーブルがパーセンテージ幅の div などのフレキシブル コンテナ内にある場合、動的な設定によりセル テキストがコンテナからオーバーフローする可能性があります。レイアウトの性質。

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

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート