ホームページ  >  記事  >  ウェブフロントエンド  >  CSS (ワードラップ/ブレーク) により、純粋な英語の数値が自動的にラップされます。

CSS (ワードラップ/ブレーク) により、純粋な英語の数値が自動的にラップされます。

不言
不言オリジナル
2018-06-12 11:29:231919ブラウズ

この記事では、純粋な英語の数値を自動的にラップする CSS (ワードラップ/ブレーク) の使用方法を主に紹介します。必要な友達に共有します。 IE と FF の両方で、大きなコンテナは自動的に折り返されず、数字や英語の中に中国語の文字が含まれている場合は、その中国語の文字から折り返されますが、純粋な中国語の文字は自動的に折り返されます。この問題に対処するために、この記事では詳細な解決策を示します。興味のある方はぜひお見逃しなく。この記事がお役に立てば幸いです

定義された幅を持つブロック要素が純粋な英語または純粋な数字で埋められると、コンテナーは IE と FF で拡大され、折り返されません。また、数字や英語の中に中国語の文字が含まれている場合、行は中国語の文字から折り返されますが、純粋な中国語の文字は自動的に折り返されます。この問題を解決するにはどうすればよいでしょうか?まずは 2 人の主人公であるワードラップとワードブレークについて理解しましょう

ワードラップは改行を制御するために使用されます
2 つの値:
(1)normal
(2)break-word (この値は強制的に使用されます)改行、内容は境界内で折り返されます。中国語の場合は問題ありません。英語の文章では問題ありません。ただし、英語の長い文字列の場合は機能しません。)

ワードブレイクは単語を制御するために使用されます。 Break
3 つの値: (. 1)normal
(2)break-all (単語を分割します。単語が境界に達すると、次の文字が自動的に次の行に移動します。これは主に長い英語の文字列の問題を解決します.)
(3)keep-all (中国語、日本語、韓国語には連続した単語があり、1 行に 1 文があり、古代の詩をアレンジするのに使用できます~)

【解決策】

word-wrap:break-word; 
word-break:break-all;

を追加できます(1) CSS のbreak-all (ブレークワード) 単語が境界に達すると、次の文字が自動的に次の行に移動します。これにより、主に長い英語文字列の問題が解決されます。) (2) keep-all。 (中国語、日本語、韓国語を指し、1行に1文ずつ使えます。古詩をアレンジしてください~)

(3)break-word (この値は強制的に改行するために使用され、内容は境界内で改行されます。中国語は問題ありませんし、英語の文章も問題ありません。ただし、長い英語の場合はうまくいきません。)


以上がこの記事の内容です。関連コンテンツの詳細については、PHP 中国語 Web サイトに注目してください。

関連する推奨事項:

CSS の強制改行におけるワードブレイク、ワードラップ、ホワイトスペースの違い


以上がCSS (ワードラップ/ブレーク) により、純粋な英語の数値が自動的にラップされます。の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。