豆袋

簡単な方法と、より細かくカスタマイズできる方法、2通り。

簡単なのは、シンプルにヘッダーの背景にCSSで画像を設定するだけ。
気を付けるのは画像の高さや、乗っかる文字の色、

ヘッダー背景を画像にする
http://10plate.blog44.fc2.com/blog-entry-28.html

#header {
background: #ffffff;
background-image: url(http://〜);
height: 300px;
}

リピートさせるのかどうか。
横幅ピッタリの画像を作って、センターに配置するのが一番いいのかな。
#header {
background-image: url(http://〜);
height: 300px;
background-repeat: no-repeat;
background-position: center;
}




ちょっと難しい方法。大変そうだけど、挑戦してみたいな。

basic_whiteテンプレート ヘッダー全体に背景画像を入れる
http://fc2blogtemplate.com/blog-entry-16.html

div id="head-img"をこしらえて、headerの中に入れる。

CSSでhead-imgのほうを細かくカスタマイズすれば分かり易い。

ウインドウに合わせて画像を表示する方法
#head-img {
background-size: cover !important;
padding: 20px 0 80px 0; min-height: 1px;