MovableTypeで、フォーマット「改行を変換」でいろいろやってみた
本文入力時にテキストフォーマットを数パターン選べますが、その中の「改行を変換」を使用した場合の変換がどうなるかいろいろ試してみました。
ちなみにバージョンは最新の6.2です。
テキストをそのまま書く場合。1行空けると< p >で囲まれる
本文入力例
テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。
テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。
テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。
出力結果
<p>テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</p>
<p>テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</p>
<p>テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</p>
一部をタグ(ブロック要素)で囲うとそこは< p >の対象から外れる
本文入力例
<div>テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</div>
テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。
テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。
出力結果
<div>テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</div>
<p>テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</p>
<p>テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</p>
##一部をタグ(インライン要素)で囲うと、そこは< p >でさらに囲まれる
本文入力例
テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。
<span>テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</span>
テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。
出力結果
<p>テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</p>
<p><span>テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</span></p>
<p>テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</p>
##さらに、一行を空けない場合は改行(< br / >)に変換される
本文入力例
テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。
<span>テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</span>
テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。
出力結果
<p>テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。<br />
<span>テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</span></p>
<p>テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</p>
##インライン要素はすべからく< p >で囲まれる
< p >以外で囲いたい場合は他のブロック要素(< div >など)で囲う
本文入力例
<img src="aaaaaa.jpg">
テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。
<span>テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</span>
テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。
出力結果
<p><img src="aaaaaa.jpg"></p>
<p>テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</p>
<p><span>テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</span></p>
<p>テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</p>
##< div >で全体をぐるっと囲っても、正しく< p >で処理される
本文入力例
<div>
<img src="aaaaaa.jpg">
テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。
<span>テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</span>
テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。
</div>
出力結果
<div>
<p><img src="aaaaaa.jpg"></p>
<p>テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</p>
<p><span>テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</span></p>
<p>テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</p>
</div>
##< section >や< article >はどうやら、正しく処理できない
本文入力例
<section>
<img src="aaaaaa.jpg">
テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。
<span>テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</span>
テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。
</section>
出力結果
<p><section></p>
<p><img src="aaaaaa.jpg"></p>
<p>テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</p>
<p><span>テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</span></p>
<p>テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</p>
<p></section></p>
##ブロック要素の中で1行空けてしまうと、どうも処理がおかしい。。。
本文入力例
<dl>
<dt>ああああああ</dt>
<dd>aaaaaaaa
あああ
あああ
</dd>
</dl>
<div>テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。
テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</div>
出力結果
<dl>
<dt>ああああああ</dt>
<dd>aaaaaaaa
あああ
<p>あああ<br />
</dd><br />
</dl></p>
<div>テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。
<p>テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</div></p>