はてなブログの編集「見たまま」で改行の行間を少なくする方法

はてなブログを始めて、最初の記事を書くなりいきなり壁に当たりました。改行をした時に自分が思っているよりも行間が空いてしまうのです。その解決方法はHTMLを知っていれば分かるのかも知れませんが、すぐに気が付くのが難しいと思ったので記事にしてみました。

改行の行間を少なくする方法

方法は単純です。普段「Enter」で改行するところを、「Shift + Enter」で改行をしてあげるだけです。実際に見比べてみましょう。

「Enter」で改行をした場合は↓のようになります。

「Enter」改行の1行目

「Enter」改行の2行目

「Enter」改行の4行目（3行目は空行）

「Shift + Enter」で改行をした場合は↓のようになります。

「Shift + Enter」改行の1行目
「Shift + Enter」改行の2行目

「Shift + Enter」改行の4行目（3行目は空行）

かなり違うのが分かりますね。

改行の行間が異なる理由

改行の行間が2種類ある理由は、OfficeのWordと同じだと考えると分かりやすいと思います。Wordで「Enter」を押すと『段落』が変わり、「Shift + Enter」を押すと『行』が変わります。
これと同じで、はてなブログでも「Enter」を押すと『段落』を記述する<p>タグ（Paragraph = 段落）、「Shift + Enter」を押すと『改行』を記述する<br>タグ（Break = 改行）が記述されます。編集「見たまま」タブの隣の「HTML編集」タブで見てみると良く分かります。

「Enter」で改行をした場合のHTML

<p>「Enter」改行の1行目</p>
<p>「Enter」改行の2行目</p>
<p> </p>
<p>「Enter」改行の4行目（3行目は空行）</p>

「Shift + Enter」で改行をした場合のHTML

<p>
「Shift + Enter」改行の1行目<br />
「Shift + Enter」改行の2行目<br />
 <br />
「Shift + Enter」改行の4行目（3行目は空行）<br />
</p>

単純にブログを書きたいだけなのですが、そこはWebの世界。プログラムフリーの世界はなかなか遠いですね。