CSS の改行についてどのくらい知っていますか: ワードラップ && ワードブレーク && ホワイトスペース && ワードスペース_html/css_WEB-ITnose

CSS 行の折り返しについてどのくらい知っていますか: ワードラップ && ワードブレーク && ホワイトスペース && Word-spacing_html/css_WEB-ITnose

word-wrap :

最初のall、word-wrap この CSS プロパティは、CSS3 では overflow-wrap という名前に変更されました。このセマンティクスは、ワードブレークとの混同を避けるためでもあります。ブラウザが、分割できない文字列がオーバーフローするのを防ぐためです。改行を許可する人ではありません。

• 値:

• 単語が長すぎるので、新しい行に変更しようとします。ラインが変わってからまだ時間が経っているので、この仕事を辞めました、そして労使はそれを変えません、はい、激しくあなたに言い聞かせます。

• break-word:

• 単語が長すぎる場合は、新しい行に分割してください。改行後も長すぎる場合は、再度変更します。おじさん、満足するまで

• word-break:
  

• Reference :

• CSS プロパティは、改行するかどうかを指定するために使用されます。単語内。

• この製品は、単語内の改行方法を決定するために使用されます。

  
  

値:

標準:

• デフォルトの改行ルールを使用します。

• 区切り:
  テキスト間の CJK(中国語/日本語/韓国語)以外の単語の区切りを許可します。
keep-all:
では、CJK (中国語/日本語/韓国語) テキストでのワードラップは許可されず、半角スペースまたはハイフンのみが許可されます。非 CJK テキストの動作は、実際には通常と同じです。

• 
  

• word-wrap:break-word VS word-break:break-all

これを見たら爆発する友達もいるかもしれない、「クソ、ニー・マが示した」 「これは、この 2 人は同一人物ということですか。嘘をつかないでください、バカ!」

• この 2 人は当然違います。そうでなければ、W3C はわざわざ前者の名前を変更させないでしょう。この 2 人を区別しましょう。 。
  

  下の写真を見て話してください:

• #test1 と #test2 を比較すると、違いが簡単に見つかります:

• どんな言葉であっても、ブレイクオールは非常に暴力的ですすべてと言ったら、行を変更してください ;
  

  しかし、それと比較すると、ブレークワードははるかに穏やかです。それを入れることができない場合は、まず行内に改行できる場所があるかどうかを確認してください。スペースまたは CJK がある場合は、単語を放し、その時点で改行します。
white-space:

前述のように、word-wrap:break- word は、スペースや改行を含む単語内で改行を実行する前に、行内に改行ポイントがあるかどうかを確認します。

つまり、スペースと復帰の運命を特別に制御する別の人がいます:
スペースを結合するかどうか;

長すぎる文をスペースで区切るかどうか;

値:

Normal: 空白はブラウザによって無視されます。


pre: 空白はブラウザによって保持されます。
nowrap:

タグが見つかるまでテキストは折り返されません。空白のシーケンスを削除し、通常どおりに続行します。 改行;

行前: 空白のシーケンスを結合し、改行を保持します。

継承: 親要素の特性を継承します。

word-spacing:

この人は上記のものとはほとんど関係がなく、単語の間隔を設定しているだけで、使い方は非常に簡単です:

p{

Word- spacing: 30px;

}

CSS が少し歪んでいることに気づいていますか?これはただ蓄積されているだけだと誰が言いましたか? CSS 改行の内容は、word-wrap && word-break && white-space && word-spacing_html/css_WEB-ITnose です。その他の関連コンテンツについては、PHP 中国語 Web サイト (www.php.cn) に注目してください。