3年でエリート公務員辞めた結果…

月間30万PV以上!元国家公務員(総合職・旧1種)による備忘録。通称「さんエリ」

試してみて!ブログタイトルに影をつけるだけで立体感が出て見た目が引き締まるよ

ブログを運営するすべての方へ 

 ひと昔前に比べて、デザインに凝ったブログが増えましたね。

 デザインに凝るといってもごちゃごちゃしすぎず、引き算のデザインが上手い方が多いのも最近の風潮だと思います。

 さて、今日は、そんな凝ったデザインの方も、デザイン初心者の方も、ひと手間加えるだけで簡単にブログに高級感を出すことのできる、ワンポイントをお教えしたいと思います。

次の2枚の画像を見比べてみてください

f:id:soumushou:20160515172638p:plain

f:id:soumushou:20160515172633p:plain

 どちらが好みですか?

 違いがわからない方は、タイトルバーの下の部分を見てください。

 上の画像では影がついていませんが、下の画像では影がついています。

 気づかなかった方は、それを意識してもう一度見てみてください。

 どうでしょうか。

 影がついていると、立体感が出て高級に見えませんか??

タイトルバーに影をつけるのは簡単

 この影をつけるのは簡単です。

 特に画像をアップロードしたりする必要など、一切ありません。

 具体的には、CSSの中でbox-shadowというコードを使うだけです。

 

 はてなブログの方は、次の3行を

 <ダッシュボード→デザイン→カスタマイズ→CSS>

 の部分に張り付けてみてください。

 

#blog-title {
box-shadow: 0px 6px 10px;
}

 

※適用しているデザインによっては、反映されない場合があります。その場合は、ソースを解析して、「#blog-title」の部分を変更してください(どうすればいいか分からない方は、お問合せ頂ければ可能な限り対応します)。

 

 3行書くだけで、あっという間にブログのデザインが引き締まります。

 のっぺりとしたブログデザインがしっくりと来ていなかった方、是非お試しください。 

それ以外のカスタマイズ

 このブログで行っているそれ以外のカスタマイズはこちらを御紹介しています。

www.soumushou.com