<br>を使わずにCSSだけで改行したい場合があります。
そんな時に使えるテクニックです。
::beforeを使う場合（spanの前で改行します。）
【CSS】※::beforeの場合
|
1 2 3 4 |
.br::before { content: "\A"; white-space: pre; } |
【HTML】
|
1 |
<p>あいうえお<span class="br">かきくけこ</span>さしすせそ</p> |
【表示例】
あいうえお
かきくけこさしすせそ
::afterを使う場合（spanの後で改行します。）
【CSS】※::afterの場合
|
1 2 3 4 |
.br::after { content: "\A"; white-space: pre; } |
【HTML】
|
1 |
<p>あいうえお<span class="br">かきくけこ</span>さしすせそ</p> |
【表示例】
あいうえおかきくけこ
さしすせそ
以上です。
