CSS基礎 練習問題 44:テキストの折り返し制御
HTML内で改行せずに長く記述されたテキストについて、親要素の右端に到達しても自動で折り返さず、1行のまま水平に突き抜けさせて表示したい場合、正しいCSSの書き方はどれか。
- text-wrap: none;
- line-break: off;
- word-wrap: keep;
- white-space: nowrap;
- overflow: hidden;
正解と解説を見る
正解:white-space: nowrap;
テキストを自動で折り返さずに1行のまま表示させるには「white-space: nowrap;」が正解です。
【正解の理由】
「white-space」プロパティは空白文字や改行の扱いを制御するもので、「nowrap」を指定するとテキストが親要素の幅を超えても改行されずにそのまま続きます。
【不正解の理由】
• 「text-wrap: none;」は存在しない値であり、正しくは無効な記述である
• 「line-break: off;」は改行規則のプロパティだが、折り返しを禁止する機能はない
• 「word-wrap: keep;」は単語の途中で改行するかを制御するプロパティであり不適切
• 「overflow: hidden;」ははみ出た部分を隠すだけで、折り返し自体を禁止するわけではない