他のサイト(例えば Yahoo: http://www.yahoo.co.jp/) にリンクを張るには、<a> を用いて次のようにします。
<a href="http://www.yahoo.co.jp/">Yahoo!</a>
Yahoo の部分が下線付きの青色で表示され、そこをクリックすると、そのページにジャンプできるようになります。
例えば、http://www.yyy.zzz/aaa/bbb/ccc.html というページへのリンクを張る場合、次のようにします。これは通常、www.yyy.zzz という名前のサーバーの、aaa フォルダの中の bbb フォルダの中の、ccc.html という名前のファイルを意味しています。
<a href="http://www.yyy.zzz/aaa/bbb/ccc.html">ページ</a>
ページが同じサーバー内にある時は、http://~ を省略することができます。
<a href="/aaa/bbb/ccc.html">ページ</a>
さらに、ページが同じフォルダにある場合は /~...~/ も省略することができます。
<a href="ccc.html">ページ</a>
たとえば、作成した HTML ファイルが次のようなフォルダに置かれているとします。
WebPages folderA aaa.html bbb.html folderB ccc.html folderC ddd.html
aaa.html から bbb.html にリンクするには次のようにします。
<a href="bbb.html">ジャンプ</a>
aaa.html から ccc.html にリンクするには次のようにします。
<a href="folderB/ccc.html">ジャンプ</a>
aaa.html から ddd.html にリンクするには次のようにします。ドットドット(..
)は「ひとつ上のフォルダ」を意味します。
<a href="../folderC/ddd.html">ジャンプ</a>
リンク先にファイル名ではなく、フォルダ名を指定することもできます。
<a href="../folderC/">ジャンプ</a>
<a href="http://xxx.yyy.zzz/ukeke/">ジャンプ</a>
この場合、通常、そのディレクトリの中にある「省略時ファイル」が表示されます。省略時ファイルは index.html だったり、index.htm だったり、default.htm だったりします。(サーバーの種別や設定によって異なります)
また、省略時ファイルが存在しない場合は、そのフォルダ内のファイルの一覧が表示されます。(これも、サーバーの設定によって表示できない場合があります。)
ページの途中の特定の場所にジャンプすることもできます。まず、ジャンプ先の個所に id 属性で名前をつけておきます。ブラウザ上では何の変化もありません。<a href="#名前">~</a> のリンクをクリックすると、その名前の場所にジャンプします。
<h4 id="LocalLink">自サイト内のリンク</h4> : → <a href="#LocalLink">自サイト内のリンク</a>
次のリンクをクリックしてみてください。
他サイトや他フォルダ、他ファイルの特定個所へのリンクは次のようにします。
<a href="http://www.yyy.zzz/aaa.html#Link">ジャンプ</a>
target 属性を指定することにより、リンク先を別ウィンドウや別タブで表示することができます。
<a target="_blank" href="http://www.yahoo.co.jp/">Yahoo!</a>
下記のリンクをクリックしてみてください。