はりをきば

そこにピカマンがいる限り 私はテイッハットウッをやめない


Caution!!
この日記はバカな私(はりを)が何かを忘れない為に、バカの一つ覚えの如く色んな記事を投稿しています。…が、
あくまでもただの備忘録のひと握りに過ぎず、情報の信憑性や真偽までは保証していません。
極力正しい情報をまとめているつもりですが、万一誤った記事の内容を実行しトラブル等が発生しても
当方は如何なる責任を負いません。自己責任でご利用ください。

以上に同意する方のみ、この雑記帳の閲覧をお願いします。

初めての方はこちらも併せてお読みください。このブログについて (About)


…ちゃ、ちゃんと予防線張ったからな!! ホント何があっても知らねーからな!!!(小学生並の言い訳)

予防線(☢Caution!!☢)の表示
テキスト全般の表示に使うフォント (大抵は「メイリオ」か「ヒラギノ角ゴ ProN W3」) (マルチバイト文字はSource Han Sansと同じ) (マルチバイト文字はNoto Sansと同じ)
ソースコードの表示に使うフォント
ピカマンロケットの効果音

設定を保存キャンセル

CSSの擬似要素を使って改行する

久しぶりの備忘録。面倒なので前置き割愛。



改行コードを直接流し込む

<span class="cr">ピカマンよ</span><span class="lf">ああピカマンよ</span><span class="crlf">ピカマンよ</span><span>by マサラ人</span>
span.cr::after,
span.lf::after,
span.crlf::after {
	white-space: pre;
}

span.cr::after {
	content: "\d";
}

span.lf::after {
	content: "\a";
}

span.crlf::after {
	content: "\d\a";
}


ピカマンよああピカマンよピカマンよby マサラ人


CR(0x0D)やLF(0x0A)といった改行コードを直接入れる。
見ての通り、改行されるのはLFだけで、CRは除去される。*1


また、改行コードだけではHTMLでは改行と認識されない。
その為、white-space: pre;で改行コードを改行として認識させる。



ブロック要素で改行

<span class="br">ピカマンは神です。</span><span>偉い人にはそれがわからんのです。</span>
span.br::after {
	content: "";
	display: block;
}


ピカマンは神です。偉い人にはそれがわからんのです。


擬似要素をブロック要素にすると、そのポイントで強制的に改行できる。




サンプルはafterしか載せてないが、もちろんbeforeでも可能。


…以上。




今日でこのブログを開設してからちょうど半年。
いつからかGoogleのサジェストにもこのブログ名が載るようになった。
こんな辺境の地(ブログ)に訪問するなんて、みんな物好きだよねぇ。。

*1:但しIE9のみ例外で、CR単体でも改行として認識する。