CSS解説 テキストの折り返し制御
word-breakプロパティ
テキストが・・・・
表示したい範囲を突き抜けた。。。
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
英字や英単語だと、自動で改行してくれなくて、そうなっちゃうことあるよね。。。
自動で改行したい時はCSSで「word-breakプロパティ」を指定すれば大丈夫ですよ。
【英単語でも途中で折り返す指定】
(CSS部分)
.orikaeshi {
word-break:break-all;
}
(HTML部分)
<div class="orikaeshi">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</div>
【可能な限り英単語を途中で折り返さない指定】
(CSS部分)
.orikaeshi {
word-break:break-word;
}
(HTML部分)
<div class="orikaeshi">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</div>
このように指定すれば<div class="orikaeshi">と</div>の間にある文字aが折り返し位置に来た時に自動で折り返しをしてくれます。
また、「可能な限り英単語を途中で折り返さない指定」では英単語のみで長くて折り返し位置に来てしまったときだけ折り返します。
できるだけ折り返ししないように判断してくれるなんて、気がきいてるね。
ねー
お名前
