webエンジニアの日常

RubyやPython, JSなど、IT関連の記事を書いています

h2要素の色を変えてみました

こんにちは、エンジニアのさもです。

以前から気になっていたのですが、h1要素マーク

<- これ

が、h2要素、h3要素ともに大きさが少し違うだけで、全く区別がつかなかったんです。

こんな感じです↓

f:id:s-uotani-zetakansu:20170921111919p:plain

そこで、はてなブログではcssを書いてデザインをいじれるということなので、色だけ変えてみました。

管理画面左メニュー「デザイン」リンク

デザイン変更画面左メニューの上部にある「スパナのリンク(カスタマイズ)」

「デザインcss{}」からcssを書くことが出来ます。

残念ながら適切な色を選ぶ知識も、綺麗にできるセンスもないので、色はてきとーにしました。

以下のコードを追記します。

.entry-content h2:before{
color: #ff00ff;
}

.entry-content h3:before{
color: #00ffff;
}

出来たのがこちらです

h1

新h2

新h3

他の記事も読でいただく際は、この色を頼りに読んでいただければと思います。(笑)

たった1日で基本が身に付く!  HTML&CSS 超入門

たった1日で基本が身に付く! HTML&CSS 超入門