プロが教えるわが家の防犯対策術!

ホームページビルダーのメニュー設定について教えてください。

画像作成ソフトでボタン画像を作成しました。
このボタン画像5枚でサイト内リンクメニューを作りたいのですが、どのように設定していけばいいのでしょうか?

テキストメニューの設定方法は解説があるのですが、自作画像ボタンをメニュー設定する方法がわかりません。

マウスがあたると色が変わったり、表示ページのメニューは別画像になるなど、設定方法を教えて下さい。

A 回答 (4件)

HPBの書籍を買われるか、


下記 Sites等で、その仕組みを学ばれたらと思います。
http://hpb.web-creation.info/Prepar/index1.html
    • good
    • 0

>どのように設定していけばいいのでしょうか?



とは、どういう意味かわかりませんが、画面上の配置は「表」を作って、たとえば1列5行の表のセルの中へ画像ボタンを挿入します。

ボタン画像というのはファイルの拡張子が「gif」などですよね。

それでしたら普通に文字列と同じように「リンクの挿入」でリンクが取れます。

>マウスがあたると色が変わったり、表示ページのメニューは別画像になるなど

オンマウスで色などが変わるのは「ロールオーバー」です。色を変えたいボタンを選択状態で「挿入」「画像の効果」「ロールオーバー効果」で設定できます。

オンマウスで別画像にするには、別途別画像を作っておいてロールオーバーにします。
    • good
    • 0

No2です。



次のサイトを参考にしてください。よくわかりますよ。

http://www.wsb.jp/hpb/
    • good
    • 0

前質問の方ですね。


さっきは「表」でしたが、今回は「リスト」です。

「メニューリスト」と言う事です。表に似ていますが表では無いんです。

<ul id="nav">
<li class="bana"><a href="">バナナ</a></li>
<li class="app"><a href="">りんご</a></li>
<li class="ora"><a href="">みかん</a></li>
</ul>

横並びメニューや縦置きナビもありますし、テキスト・画像・色々です。
それらデザインや対応は、CSSで指定します。

<style type="text/css"><!--
ul#nav li{ display:block; width:200px; height:30px;}
ul#nav li a{ display:block; width:200px; height:30px; text-indent:-9999px;}
ul#nav li.bana a{background:url( ○○.jpg );} /* 例 */
ul#nav li.bana a:hover{background:url( );}
ul#nav li.app a{background:url( );}
ul#nav li.app a:hover{background:url( );}
ul#nav li.ora a{background:url( );}
ul#nav li.ora a:hover{background:url( );}
--></style>

( )内に各画像別のパスを入れて、<head></head>内に設置。

試せばわかりますが、
自由なデザインにしたいなら勉強が必要です。
    • good
    • 0
この回答へのお礼

ご丁寧にありがとうございました。

お礼日時:2011/07/30 11:38

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!