はてなブログの画面テーマとして Brooklynを利用しています。初心者の私が、標準のスタイルだけでは物足りなくなってきたのでカスタマイズを行うことにしました。
今回は、本文のフォントサイズ変更についてです。
このあたりの話題を検索すると最初にヒットするのは以下のサイトです。
「うわっ…はてなブログ、読みにくすぎ…！」最大の原因はコレ – オークニズム
基本的にはここに記載されている通りにコードをデザインcssにコピペすれば動きます
（デザインcssって何？というかたは、ダッシュボードから
デザイン → カスタマイズ（レンチアイコン）→ { }デザインCSS
と進めば入力欄が出てきますので、そこをクリックして以下のコードを貼り付ければOK）
.entry-content p {font-size: 16px;}
この中の 16pxがフォントのサイズなので、もう少し大きい方がよいという人はこれを17pxや18pxなど大きい数字にすればOKです。最初のコロン.とpxのあとにセミコロン; を忘れずに。
（そもそも .entry-content p … なんだかおまじないみたいだと感じた方は、.entry-content部分がwebページの中のentry-contnetという名前のついた場所（住所）を示しており、その場所にあるpに続く部分に記載された文字のサイズを16pxにすることを指定していると考えてもらえば理解しやすいと思います。
詳しく学習したい方は評判のよい本をいくつか読んで見るのがよいかと思います。別の機会に私が使った本も紹介できればと思います。
TOP画面のフォントサイズの変更
では上記の対応を行って改めて自分のブログを見てみてください。おや？フォントサイズ変わってないけど・・・と思われた方もいるのではないでしょうか。
そう！ これだけでは必ずしも十分ではないのです。
上記のCSSで指定した.entry-content p
の部分は個別の記事画面の文章のフォントサイズを変更することはできますが、
TOPにでてくる記事一覧の画面にはこのサイズ変更が適用されません。
まとめ画面のフォントサイズ変更は以下のCSSを追加で入れる必要があります。
1行目のスラッシュとアスタリスクで囲った部分/* */はコメント欄ですので動作に影響はありません。
2−4行目を追加で入れればOKです。
/* TOP（まとめ）画面のフォントサイズ */ .page-archive .archive-entries .entry-description { font-size: 17px; } /* 記事ページの本文フォントサイズ */ .entry-content p {font-size: 17px;}
はい、これであなたのブログ画面のフォントサイズが調整できました。
CSSを変更すればこのほかにもフォントの色、画面の背景色、画像の設定などほぼすべてのカスタマイズが可能となります。
このあたりの話題は別の機会に取り上げられたらと思いますが、参考になるサイトはたくさんありますのでそちらをご参照ください。
May your blog life be with happy!