個人サロン・リラクゼーションサロン専門・ホームページ制作・作成講座・SEO対策・W3C・シンプルデザイン

ホームページ作成講座 < リンクの貼り方・メニューの作り方

リンクの貼り方・メニューの作り方

リンクの貼り方、メニューの作り方について動画を撮りましたので確認して下さい。

リンクの貼り方・タグ一覧

タグに関しては枠で囲って載せておきますので、コピーして使えるようにしておきます。

テキストリンクの場合

<a href=""></a>

使い方としては蛍光ペンの部分を差し替えて記述して下さい。

<a href="ここに飛ばしたいページのURLを記述する">テキストリンクに表示したい文字を記述する</a>

テキストリンク表示例

リンクの貼り方・メニューの作り方

画像リンク・画像メニューの場合

<a href=""><img src="" width="" height="" alt="" /></a>

使い方としては蛍光ペンの部分を差し替えて記述して下さい。

<a href="ここに飛ばしたいページのURLを記述する"><img src="表示したい画像URLをここに記述する" alt="画像の説明文をここに記述する" width="画像の横幅を記述" height="画像の縦幅を記述" /></a>

画像リンク・画像メニュー表示例

リンクの貼り方・メニューの作り方

マウスポインターを載せた時に画像を変える方法

<a href=""><img width="" height="" src="" onmouseover="this.src='';" onmouseout="this.src=''" alt="" /></a>

使い方としては蛍光ペンの部分を差し替えて記述して下さい。

<a href="ここに飛ばしたいページのURLを記述する"><img width="画像の横幅を記述" height="画像の縦幅を記述" src="表示したい画像URLをここに記述する" onmouseover="this.src='マウスポインターを載せた時に表示したい画像URLをここに記述する';" onmouseout="this.src='最初の表示したい画像URLをもう一度ここに記述する'" alt="画像の説明文をここに記述する" /></a>

マウスポインターを載せた時に画像を変えた画像リンクの表示例

リンクの貼り方・メニューの作り方

別のウィンドウでページを表示させる方法

target="_blank"

使い方としては赤文字の部分を追加して記述して下さい。

<a href="ここに飛ばしたいページのURLを記述する" target="_blank">テキストリンクに表示したい文字を記述する</a>

別のウィンドウで表示させる記述を追加した場合の表示例

クリックすれば別のウィンドウで表示されます。

リンクの貼り方・メニューの作り方

ご質問がありましたら、メールフォームよりお問合せ下さい。

お問合せメールフォーム

このページの先頭へ トップページへ