はてなブログのソース背景色を変える

今までQtのソースをそのまま張り付けると、

int main()

    cout << "Hello World!" << endl;

    return 0;

みたいに背景が灰色になり、
文字色も通常使用しているものとは違うものになっていました。
（ちなみにスマフォでは灰色の枠に囲ってる状態に見えます。）

ただ、深く考えず使用していたのですが、
Visual Studioでソースをそのまま貼ると、普通に入力したときと同じフォント、色になるんですよね。

ソースをわかりやすいように書きたいなと思っていたのですが、
そもそも背景色等をCSSで普通に指定してやればいい話のようでした。

以下の手順でCSSの設定を行ってみました。
1. ログインして「設定」の画面に移動
2. 「編集　はてな記法」に設定（Markdownでも可能だけど方法が少し異なる）
3. CSS追加
CSSは、以下の手順で進んでいくと設定できました。
デザイン→六角レンチ?マーク→デザインCSS
f:id:shinopikapi:20181026233240p:plain
f:id:shinopikapi:20181026232300p:plain

デザインCSSには、こちらのブログを参考にさせていただきました。
ありがとうございます。
orangain.hatenablog.com

以下のコードをデザインCSSに追加します。
（わからない人は、元々あったコードは消さない）

.entry-content pre.code {
    background-color: #e0e0e0;
    color: #000000;
}
.synSpecial { color: #dc322f }
.synType { color: #0095d9 }
.synComment { color: #006e54}
.synPreProc { color: #cb4b16 }
.synIdentifier { color: #268bd2 }
.synConstant { color: #2aa198 }
.synStatement { color: #859900 }