はてなブログの見たまま編集で記事を書いてから、自分で確認した時にずっと違和感がありました。改行すると意図しない隙間ができ『行間が広すぎる』のです。
初歩的ですが...今回は、はてなブログの行間の隙間をcssで調整し読みやすくする方法をご紹介します。
隙間の調整方法はデザインcssにコピペでOK
デザインcssにコピペで簡単に調整できます！
ダッシュボードからデザイン→カスタマイズ→デザインcssに
『 .entry-content p { margin:0} 』
これをコピペするだけです！かぎカッコは削除してくださいね！
行間の隙間を修正する前
スマホ画面をスクショしました。
改行しただけでこれくらい隙間があいてしまいます。
だいたい一行分くらいの隙間がありますね。
意図しない隙間が発生します。
行間の隙間を修正した後
調整できました。改行しても大きな隙間がなく自然な感じになりました！
もっと狭くしたいなとか狭すぎるなと思われた時は
『 .entry-content p { margin:0} 』
０.1単位で数字を増やしたり、マイナスにしたり調整してみてください！
line-heightでも行間を調整できる
１行の大きさを調整しましょう。
.entry-content {
font-size:18px;
line-height:1.0;
}
font-sizeが文字の大きさです。
line-heightが行の大きさです。
line-heightを１にすれば文字の大きさがそのまま１行の大きさになります。
参考にさせていただいたサイト。
さいごに
個人的には修正後の方が好みなので調整してみました。
はてなブログ標準の広いままが良いという方はもちろんそのままで大丈夫です！70記事も書いておいて今更ですがcssでこんなところも調整できるのですね～まだまだ勉強不足です。
改行で意図しない隙間ができてお困りの方はぜひコピペで調整してみてください！