1. テーブルの幅を設定します。つまり、テーブルに幅の値 (パーセンテージではなく数値) を与えます。
2.
div{ を
ラップしないように強制する
//空白: 通常のデフォルトでは行の折り返しはありません。nowrap では、テキストが終了するか br オブジェクトが見つかるまで、すべてのテキストが同じ行に表示されます。
ホワイトスペース:ナラップ;
div{ を
自動的にラップする
word-wrap: Break-word;
//word-break は、アジア言語と非アジア言語の通常のテキスト ルールを設定し、単語内での改行を許可します。
単語区切り: 通常。
}
英語の単語を強制的に改行する
div{
単語区切り:すべて区切り;
}
3. まとめると、CSS で次の文が定義されていれば、Web ページが再度開かれないことが保証されます。
テーブル{テーブルレイアウト: 固定;}
td(word-break:break-all; word-wrap:break-word;)
コメント:
1. 最初のテーブル{table-layout:fixed;}、このスタイルはテーブルに!!!(感嘆符)を自動的に持たせることができます。文字を折り返す。
2.td{word-break: Break-all}、通常はこの文を使用しても問題ありませんが、特殊なケースでは依然として分割されるため、次の文を追加する必要があります (word-wrap: Break-word;)それは解決できます。このスタイルでは、表内の一部の連続する英単語を自動的に折り返すことができます。
http://www.knowsky.com/
(1) 文法：
word-break：break-all | keep-all
パラメータ：
normal：アジア言語および非アジア言語のテキストルールに従って、単語内の改行は許可されます。
Break-all : 動作はアジア言語の通常の動作と同じです。非アジア言語のテキスト行の任意の単語内での区切りも許可されます。この値は、アジア以外のテキストを含むアジアのテキストに適しています。
keep-all : すべての非アジア言語の通常と同じです。中国語、韓国語、日本語の場合、単語の区切りは許可されません。少量のアジア語テキストを含む非アジア語テキストに適しています
(2) 構文:
ワードラップ: 通常 | ブレークワード
パラメーター:
通常: コンテンツが指定されたコンテナーの境界を越えることを許可します。
Break-word : コンテンツは境界内で分割されます。必要に応じて、ワードブレークも行われます。
説明:
現在の行が指定されたコンテナーの境界を超えたときに行を区切るかどうかを設定または取得します。
対応するスクリプト機能はワードラップです。私が書いた他の本もご覧ください。
(3) 構文:
table-layout: auto | 固定
パラメータ:
auto: デフォルトの自動アルゴリズム。レイアウトは各セルの内容に基づきます。各セルが読み取られて計算されるまで、テーブルは表示されません。非常に遅い
固定: 固定レイアウトアルゴリズム。このアルゴリズムでは、水平レイアウトは表の幅、表の境界線の幅、セル間隔、列の幅のみに基づいており、表の内容とは何の関係もありません
。
テーブルを自動的に折り返すにはどうすればよいですか?
テーブルのレイアウト アルゴリズムを設定または取得します。
対応するスクリプト属性は tableLayout です。
4. インターネット上のほとんどの記事によると、次のことを追加するだけです。
コード
.....
コード:
テーブル{
テーブル レイアウト:固定;ワード ブレーク:ブレークオール;ワードラップ:ブレークワード;}
div{ワードブレイク:ブレイクオール;ワードラップ:ブレイクワード;}
これにより、壊れたテーブルとレイヤーの問題を解決できます。これが最初にやったことです。ただし、このようなコードでは英語の単語がすべて切り捨てられるという問題が発生します。これは英語の書き方の習慣に合っておらず、読みにくくなります。
後で、上記のコードを書き直すことで、テーブル/レイヤーの破損と単語の破損を防ぐことができることがわかりました。
次のように：
コードコード
:
テーブル {
テーブルレイアウト: 固定;
ワードラップ:ブレイクワード;
}
ディビジョン {
ワードラップ:ブレイクワード;
これ
は私が現在使用しているコードでもあります。