やまだ系

コンピューターやWEB関連の情報収拾と整理、資格取得に関することを目的にしたブログ

その10

とりあえず、今回の修正をゆっくりと振り返っていきます。
まず、タイトル画像は今回はCSSでの設定ではなくなっています。
おかげで、コメントとか、プロフィール画面にはブログトップに表示されるタイトル画像表示されなくなっています。タイトル画像については、はてなの管理メニューの日記の設定から登録できるようになっていたので、それを利用しています。

/*タイトル部分設定*/
h1 {
font-size: 18px;
font-weight: normal;
color:#666;
background:#A9C5AE;
border:1px none #f00;/*←ちなみにコレは、
  ボーダー無し設定です。テンプレートで使用している
  hatena-greenがh1タグの下に線を引いているのが効い
  ちゃっていたのでそれを解除するため*/
text-align: center;
margin: 0px auto;
padding: 0px 0px 0px 20px;
}

左メニューと日記のタイトルの画像表示設定ですが、今回利用の画像はすべて、はてなFotolife利用しているので、URLはそこの登録されたものを指定しました。
まず、左メニュー

h4.hatena-module, div.hatena-moduletitle {
margin: 1em 0 0.3em 0;
padding: 2px 0px 0px 0px;
font-size: 80%;
text-align: center;
font-weight: normal;
color:#FFF;
width:147px;  //画像の横幅
height:19px;  //画像の縦幅
background:#fff url("画像のURL") no-repeat 0px 0px;
border:1px none #fff;  //罫線無しにする
}

日記の方

/*---------------日記の1日の件名設定*/
h2 {
font-size: 100%;
background:#fff url("画像のURL") no-repeat 0px 0px;
padding: 8px 0px 2px 30px;
margin: 5px 0px 0px 0px;
width: auto;
height:29px;
_width: 100%;
}