Web標準のテンプレート販売 - ActiveStyle アクティブスタイル

メニューの背景画像の変更方法 - typeA シリーズ

概要

「images_template」フォルダ内にメニューボタン用画像として、「background_menu-gradation.gif」と「background_menu-gradation02.gif」があります。初期状態のメインメニュー背景は前者になっていますが、以下の2通りの方法でメインメニューの背景画像を差し替える事ができます。

メニューボタンの差し替え

ファイルのリネームによる変更

「images_template」フォルダ内の、下記ファイルをリネームしてください。

background_menu-gradation02.gifを
　　　↓
background_menu-gradation.gifに

この方法による画像の差し替えでは、前のファイル（02の付いていないもの）を誤って削除しないようお気をつけください。

CSSのコード書き換えによる変更

「styles-site.css」内の下記の記述を変更してください。

#mainmenu {
background: url(../images_template/background_menu-gradation.gif) repeat-x;

　　　↓

#mainmenu {
background: url(../images_template/background_menu-gradation02.gif) repeat-x;

この方法による画像の差し替えには、CSSの定義を変更する必要があります。CSSの知識のある方にはこちらの方法がおすすめです。