読者です 読者をやめる 読者になる 読者になる

イロイロひとりごと。

ブログのこと、普段の生活のことをつぶやいています

<はてなブログ>上部にあるヘッダーメニューのバー色を変えました

はてなブログ サイトデザイン・設定

お久しぶりです!

時間に少しだけ余裕ができてきたので、ちょいとブログをカスタムしたくなりまして。

 

少しだけ、弄ってみました。

 

ヘッダーメニューのバー色を変更

 

そもそもヘッダーメニュー(はてなブログロゴやメニューが並んでいるバー)を表示していない方は必要ない情報ですねー。

 

上部にあるメニューバー

f:id:setuyakuhappylife:20150502235434p:plain

コレ↑ね。

 

いま設定しているテーマでは、デフォルトが透過なんですよ。

スクロールしていくと文字が重なってしまい、それが気持ち悪くて…。

 

テーマによっては、スクロールしてもそのまま画面から消えていく設定もあって、その場合はあまり気にならないかもしれません。

 

この文字が重なるのを回避するために、ヘッダーメニューのバーに色をつけました。

 

はてなブログテーマ制作の手引き - はてなブログ ヘルプ によると、

#globalheader-container {
    color: #333;
    background: #fff;
}

これをCSSに記述するそう。 

 

文字色が濃いグレー(#333)

バーの背景が白(#fff)になっています。

 

ここを変えれば違う色に変更もできますね!

 

 Afterがコレ↓

f:id:setuyakuhappylife:20150503000134p:plain

 

白なのでわかりにくいですが、文字が重なることが無くなりました(*´ェ`*)

 

まとめ

あっと言う間に変更できたのでもっと早く設定変えればよかった(笑)

 

ヘッダーメニュー部分をアクセントカラーにしてもいいかもしれませんね。

気になる方は色を変えてみてはいかがでしょうか?

 

ヘッダーメニューを固定したり解除したりするやり方もあるかもしれませんが、私にはわかりませんでした~(+_+)