続・はてなブログのデザインCSS
この記事の続きです。
このブログのデザインテーマ Handwritingに自分のデザインCSSを追加して、さらに改良を行いました。
デザインCSS
以下が今回追加したコード。
.entry-content p a[href] { color: #6ca0a3; } pre.code { border: none; background: #f6f6f6; /* border-radius: 2px; */ }
記事内のリンクの色とコード挿入部分の表示を変えました。
.entry-content p a[href]
を指定して、記事内のリンクの色を変えました。はてなブログで自動的に作られるリンクの色を変えないために:not(.keyword)
が必要かと思ったんですが、必要ありませんでした。pre.code
を指定して、コード部分の囲み線を消して、背景色を設定しました。ちなみにコメントになっているborder-radius
は囲み線の角を丸くしていい感じにするものですが、コード部分の水平スクロールがかなり重くなったのでコメントアウトしました。(macOSのSafari 11で確認)
まとめ
簡単に変えられました。嬉しい。
ところでリンクの色がサイト内で統一されていないというのは、デザインとして大丈夫なのでしょうか...
(追記) ゾクゾクする続きを書きました→続続・はてなブログのデザインCSSとtoc