７

 リンクについて

basic.gif (3042 バイト)

３．

 ページにリンクしよう！
NE3 NE4 NE6 IE3 IE4 IE5 IE6 i

では、実際にページにリンクしてみよう。
今までの説明でわからない人も実際にやってみるとわかってくることが多いと思うから頑張ってね｡

●　絶対パスを使ったリンク
じゃあ、絶対パスを使ったリンクについてやってみよう。
これは特に自分のページではなく友達のページやお気に入りのページなど自分と全く違うアドレスの所にリンクする時によく使うんだ。
これはその人のホームページアドレスさえわかっていればいいので簡単だと思う。

<A HREF="■">〜</A> 　　　・・・・違うところへリンク！

■：移動させたいところのアドレス

じゃあ、実際はどうなるのか見てみよう。

　SOURCE
<HTML>
<HEAD>
<TITLE>リンク</TITLE>
</HEAD>
<BODY>
<A HREF="http://homepage2.nifty.com/yoshi-m/soccer/pc/">ＳＯＣＣＥＲ ＣＯＭＭＵＮＩＣＡＴＩＯＮＳ</A>
↑<A HREF="■">〜</A>の間に書いた文字がボタンとして画面に表示される
</BODY>
</HTML>

これを表示すると

　RESULT 　

ＳＯＣＣＥＲ ＣＯＭＭＵＮＩＣＡＴＩＯＮＳ
↑文字がボタンとして表示された。これを押すとＳＯＣＣＥＲ ＣＯＭＭＵＮＩＣＡＴＩＯＮＳにジャンプできる。

　

●　相対パスを使ったリンク

相対パスを使ったリンクも上の絶対パスを使ったリンクとそうは変わらない。
相対パスの意味さえわかっていれば絶対パスのときとほとんど一緒だよ。

<A HREF="■">〜</A> 　　　・・・・違うところへリンク！

■：移動させたいところの相対パス

これはさっきの絶対パスの時のタグと一緒だね｡■のところは絶対パスでもいいし相対パスでもいいということだね。
もし相対パスがわからないという人は全部絶対パスを使ってやってもいよ。ただ相対パスは書くことが少なくて楽ということだけだから｡
今回はちょっと比較をしてみよう。

　SOURCE
<HTML>
<HEAD>
<TITLE>リンク</TITLE>
</HEAD>
<BODY>

<A HREF="http://homepage2.nifty.com/yoshi-m/makehp/HTML/link/1-5.htm">メールをもらおう</A>
↑絶対パス”http://yoshimune/mine/HTML/HTML-maincont.htm”として書くとこうなる。

<A HREF="1-5.htm">メールをもらおう</A>
 ↑相対パス：”http://village.infoweb.ne.jp/~fwig2642/yoshi/make_HP/HTML/link/1-4.htm”というページから”http://village.infoweb.ne.jp/~fwig2642/yoshi/make_HP/HTML/link/1-5.htm”のページに行きたいので、比べて違う部分”./1-5.htm”を書けばいいね。

</BODY>
</HTML>

この２つを比べると・・・・・

　RESULT 　

メールをもらおう
↑↓文字がボタンとして表示された。これを押すと書いたソース（上のプログラムみたいなの)は違うけど同じ”メールをもらおう！”にジャンプできる。
メールをもらおう

このように、相対パスでも絶対パスでも結果は同じなんだ。
これで、いろんなページへ移動することができるようになったね。
だからいままで１つのページしか書いてなかった人もいろんな名前のページを作ってそこにどんどんリンクさせていけば大きなホームページができるよね｡
大きなホームページはみんなそのようになっているんだよ。
頑張ろう！

※詳しくは
jamp.gif (1016 バイト)相対パスについて

≪関連ページ≫
・リンク画像の枠線を消す

back.gif (1116 バイト)　基本となるURL
next.gif (705 バイト)　メールをもらおう！