英語や数字を連続するとコンテナが拡大し、コンテナのサイズに応じて自動的にラップできないことは誰もが知っています。CSSを使用してそれらをラップする方法を紹介します。 ディビジョン用 1.（IE ブラウザ）white-space:normal; word-break:break-all; 前者は標準に従います。 #wrap{空白:標準幅:200px; 効果: 改行を実現できます。 2. （Firefox ブラウザ）white-space:normal; word-break:break-all;overflow:hidden; 同じ FF 内で適切な実装方法はありません。スクロール バーを非表示にするか追加することしかできません。もちろんスクロール バーはありません。効果はさらに良くなります！ #wrap{空白:通常の幅:200px;} 効果: コンテナは正常で、コンテンツは非表示になります。 テーブル用 1. (IE ブラウザ) table-layout:fixed スタイルを使用します。 <スタイル> 効果: 行を折り返すことができます 2. (IE ブラウザ) スタイルを使用します。 <スタイル> 効果: 改行を行うことができます 3. (IE ブラウザ) パーセンテージを使用して TD サイズを固定する場合は、スタイル table-layout:fixed および nowrap を使用します。 <スタイル> 効果: 両方の TD が通常どおりラップされます。 4. (Firefox ブラウザ) パーセンテージを使用して td サイズを固定する場合は、スタイル table-layout:fixed および nowrap を使用し、div を使用します。 <スタイル> ここでのセル幅はパーセンテージとして定義する必要があります。通常どおり表示されますが、折り返すことはできません。 注: FF の下でコンテナのコンテンツをラップする良い方法はありません。全体的な効果への影響を避けるために、オーバーフローを使用して余分なコンテンツを非表示にすることしかできません。
または
#wrap{ワードブレイク:ブレイクオール;幅:200ピクセル;}
<div id="wrap">ddd111111111111111111111111111111</div>
または
#wrap{ワードブレイク:ブレイクオール;幅:200ピクセル;
<div id="wrap">ddd11111111111111111111111111111111111111</div>
.tb{テーブルレイアウト:固定}
</スタイル>
<テーブルクラス="tbl" width="80">
<tr><td>
abcdefghigklmnopqrstuvwxyz 1234567890
</td></tr>
</テーブル>
.tb {テーブルレイアウト:固定}
</スタイル>
<table class="tb" width="80"><tr><td nowrap>
abcdefghigklmnopqrstuvwxyz 1234567890
</td></tr>
</テーブル>
.tb{テーブルレイアウト:固定}
</スタイル>
<テーブルクラス="tb" width=80>
<tr>
<td width=25% ナラップ>
abcdefghigklmnopqrstuvwxyz 1234567890
</td>
<td nowrap>abcdefghigklmnopqrstuvwxyz 1234567890</td>
</tr>
</テーブル>
.tb {テーブルレイアウト:固定}
.td {オーバーフロー:非表示;}
</スタイル>
<テーブルクラス=tb幅=80>
<tr><td width=25% class=td nowrap>
<div>abcdefghigklmnopqrstuvwxyz 1234567890</div>
</td>
<td class=td nowrap><div>abcdefghigklmnopqrstuvwxyz 1234567890</div></td>
</tr>
</テーブル>