ブログのタイトル文字を画像で指定
ブログタイトルを、OSの影響を受けない画像に変更することにした。
まずは、好みのフォントで作ったタイトルを画像にして、はてなフォトライフにアップロード。画像アドレスをコピーする。それからヘッダのタイトル下に以下のように記述する。
<div id="title2">
<a href="(ブログのアドレス)">
<img src="(ブログタイトルの画像アドレス)">
</a>
</div>
CSSで以下のように追加して調整。
#title a{
display: none; /*デフォルトのブログタイトルを削除*/
}
#blog-description{
margin:0 0 -150px 0; /*説明文の位置を調整*/
}
#title2{
margin:0 0 150px -5px; /*新しいブログタイトルの位置調整*/
}
終了。
ちなみに、デフォルトの表示ではこんな感じ。(デフォルトの文字を太くすると少し印象が変わるが、Mac以外では全く反映されない)