そこで、以下のサイトを参考にcssを編集してみました。
アメブロ・preタグとcssで本文中にソースコードをきれいに表示
上記のcssを追加し、コードを書いてみます。
/* ■ Preタグ装飾■ */
pre{
font-family: "Courier New",Courier,monospace;
font-size: 1em;
color: #007000;
background-color: #fafafa;
border: solid 1px #bbbbbb;
line-height: 1.2em;
margin: 1em 0 0 0;
padding: 0.99em;
overflow-x: auto;
overflow-y: auto;
}
どうでしょうか
<pre><code>ここにコード</code></pre>
で囲んでみました。
べた書きするより綺麗に見えますね♪