ブログタイトルの背景画像を変更してみた。

  1. サンプルのfragments_grに使用されている、タイトル背景画像をダウンロードし、寸法を確認する。
  2. 適当な画像を用意し、フォトレタッチソフトで同じ寸法に加工し、ブログのタイトルも入れる。 
  3. gif・jpegpngなど適した形式で保存する。
  4. 設定/ブログの設定/タイトルの設定/タイトル画像 で、3.で保存した画像を選択する。
  5. デザイン/詳細設定 で、CSSを新たに記述する。
  6. ブラウザの別ウィンドウに、サンプルのfragments_grを適用した画面を表示し、ソースやCSSの情報を確認する。
  7. h1用のCSSの記述から、必要のないものをリセットするためのCSSを記述する。
  8. 記述したCSSはは下記の通り。

h1 {
background-color: #ffffff;
background-image: none;
height: 150px;
margin: 0 auto;
max-height: 150px;
padding: 0px;
text-indent: 0px;
}