gooブログのヘッダーに画像を入れたいのですが

gooブログで趣味のブログをしています。
今回、テンプレートを変えたのですが（カスタムテンプレート）、
ヘッダー（タイトルバナー）に画像を入れたいと思っています。

そこでCSSをいじってみたのですが、
上手くいきません。

ちなみに、このようにしてみました。
（画像のURLを入れてみました。）


/*-- ↓タイトルバナーに画像を入れる場合は、下記のコメントをはずし、画像URLを指定する --*/
/*--
background-image:url(<img src="http://blogimg.goo.ne.jp/user_image/48/99/769bf4 … border="0">);
background-position: center top;
background-repeat:no-repeat;
--*/
/*-- ↓タイトルバナーに画像を入れる場合は、画像に合わせて値を変更する --*/
height:200px;
}
/*-- ブログタイトルの開始位置の設定 --*/


ほかにどこか変えないといけない箇所があるのでしょうか？
教えてください。
どうかよろしくお願いします。

No.1 回答者： susy-xx 回答日時： 2011/04/20 22:23

htmlとごっちゃになっているようです。

background-image:url(<img src="http://blogimg.goo.ne.jp/user_image/48/99/769bf4 … border="0">);

このように直してみてください。
background-image:url(http://blogimg.goo.ne.jp/user_image/48/99/769bf4 …

この回答へのお礼

ありがとうございます。

おっしゃるようにもしてみたのですが、
それでも上手くいきません。
他に直すべきところがあるのでしょうか？

ちなみに、CLアドバンスというテンプレートを
使っています。

せっかくお答えしていただいたのに
申し訳ありません。

お礼日時：2011/04/20 22:42

No.2 回答者： susy-xx 回答日時： 2011/04/20 23:38

画像が表示されずにオリジナルのまま表示される、

ということでしょうか？
編集したCSSファイルは保存していますか？
うまく表示できないので元に戻しているのでしょうか。

ブログを確認したところオリジナルのままでした。

気になったのは画像の大きさと、CSSでの画像の高さの指定が
合っていないという事です。
画像の表示が崩れている＝上手くいかない
のであれば

/*-- ↓タイトルバナーに画像を入れる場合は、画像に合わせて値を変更する --*/
height:423px;
width:766px;

このように縦と横の大きさを直してください。
この数値は魚画像のものなのでこのまま使えます。

この回答へのお礼

何度もありがとうございます。

画像の表示が崩れている＝上手くいかない

ではなくて、どうしてもオリジナルのままなのです。


今のCSSはこうなってます。

/*-- タイトルバナー内部の設定 --*/
#title-banner-body {
border-bottom:solid 2px #5ca1d6;
width:100%;
/*-- ↓タイトルバナーに画像を入れる場合は、下記のコメントをはずし、画像URLを指定する --*/
/*--
background-image:url(http://blogimg.goo.ne.jp/user_image/48/99/769bf4 …
background-position: center top;
background-repeat:no-repeat;
--*/
/*-- ↓タイトルバナーに画像を入れる場合は、画像に合わせて値を変更する --*/
height:423px;width:766px;



以前のテンプレートではURLを入れるだけで上手くいきましたし、
画像の幅も自分で数値を変えて上手くいったのですが。
（そのときは「シンプル」ジャンルでした。）


すみませんが、何か思いつくことがありましたら、
よろしくお願いします。

お礼日時：2011/04/21 00:19

No.3 ベストアンサー 回答者： susy-xx 回答日時： 2011/04/21 01:15

「コメントを外してください」の部分を見落としてました。

/*--
background-image:url(<img src="http://blogimg.goo.ne.jp/user_image/48/99/769bf4 … border="0">);
background-position: center top;
background-repeat:no-repeat;
--*/

上記の部分の/*--と--*/を削除して

background-image:url(http://blogimg.goo.ne.jp/user_image/48/99/769bf4 …
background-position: center top;
background-repeat:no-repeat;

これでどうでしょうか。

この回答へのお礼

上手くいきました！！

ほんの少しのことでも反映されないものなんですね。
とても助かりましたし、勉強になりました。

本当にありがとうございました。

お礼日時：2011/04/21 02:35