一般人だけどブログ収入へ向けて歩くその足跡<2018.05.26＞

■　足跡

f:id:nagasawanet:20180519111518j:plain

前回は、はてなブログにツイッターを連携してみたくて、先達の知恵をお借りして挑戦してみました。私のような初心者でも先達の知恵があれば形に出来るのだと感激でした。

今回はさらにはてなブログをカスタマイズ！！記事を書くことがそっちのけになってきてしっまていますが・・・。

■　足跡
■　はてなブログの文字の大きさを変更してみたい
■　はてなブログの文字の大きさを変更する作業
- □全体的にまとめて変更する
- □見出しや箇条書きごとに大きさを変更する
■　まとめ

■　はてなブログの文字の大きさを変更してみたい

はてなブログの文字の大きさを変えられるらしい、とのブログを目にして早速変えてみたくなりました。文字サイズを変更するにはCSSという機能が必要だということでした。ちょっとむずかしいのでは？と思いましたが、文字サイズの変更ならばそこまで難しくないらしく挑戦してみることにしました。

■　はてなブログの文字の大きさを変更する作業

□全体的にまとめて変更する

①　デザイン＞カスタマイズ＞カスタマイズＣＳＳをクリックする。

②　参考ブログに記載されていた下記のコードをコピペして保存する。

.entry-content {
font-size:20px;
}

③　この時「カスタマイズＣＳＳ」に既にあるコードを消さない。

元々あったコード↓
/* <system section="theme" selected="6653586347149180725"> */
@import url("https://blog.hatena.ne.jp/-/theme/6653586347149180725.css");
/* </system> */
/* <system section="background" selected="fff"> */
body{background:#fff;}
/* </system> */

この下に上記の↓このコードをコピペする。

entry-content {
font-size:20px;
}

④　font-size:20pxの「２０」の数字を調整することで文字のサイズを変更できる。

□見出しや箇条書きごとに大きさを変更する

①　「HTML編集」（タイトルの上にある）をみる。

②　サイズ変更したい文の一番左にある<p>や<h4>や<h3>などをみる。

　　↓下記の赤い部分。

<h3>■　はてなブログの文字の大きさを変更してみたい</h3>
<p>はてなブログの文字の大きさを変えられるらしい、とのブログを目にして早速変えてみたくなりました。文字サイズを変更するにはCSSという機能が必要だということでした。ちょっとむずかしいのでは？と思いましたが、文字サイズの変更ならばそこまで難しくないらしく挑戦してみることにしました。</p>

③　<p>や＜h4>を「タグ」といいそのタグのサイズの指定をする。

<h3>を24pxにして、<p>を15pxにしたい時はこのようにする。

下記のコードを「カスタマイズＣＳＳ」にコピペする。

.entry-content h3 {
font-size:24px;
}

.entry-content p {
font-size:15px;
}

参考にさせていただいたブログ

nukio0803.hatenablog.com