logo

その他にもどる

リンク

例えば、南阿蘇村のホームページへのリンクは、次のような構文になる
<html>
<head>
<title>マイ・ホームページ</title>
</head>
<body>

皆さん、こんにちは。
南阿蘇村のホームページは <a href="http://www.vill.minamiaso.lg.jp/web/">こちら</a> です。

</body>
</html>

リンクタグをいくつかご説明
●別窓を開かせる
<a href="http://www.****/" target="_blank">こちら</a>
●メールの場合
<a href=mailto:****@***.ne.jp>こちら</a>
●電話の場合
<a href="tel:090-1234-5678">こちら</a>
●件名を お問合せ にする
<a href=mailto:****@***.ne.jp?Subject=お問合せ>こちら</a>
●お問合せ の文字化けを防ぐためにエンコードする
<a href=mailto:****@***.ne.jp?Subject=%82%a8%96%e2%8d%87%82%b9>こちら</a>
エンコードは こちら でどうぞ
次は自分のホームページ内で、別のページへ移動する場合のリンクの方法
ちょっとややこしい
ホームページのフォルダ構成が図
「kira」のフォルダに、index.html、kira.css のファイルと 「cgi」、「css」のフォルダがあり、
「cgi」のフォルダにには、
cgi.html のファイルと 「date-cgi」 のフォルダがあり、

「data-cgi」のフォルダにには、
data-cgi.html のファイルがあったとし、

同様に 「css」のフォルダにには、
css.html のファイルと 「date-css」 のフォルダがあり、

「data-css」のフォルダにには、
data-css.html のファイルがあったとする

「index.html」 から 「cgi.html」 へと移動するには下のようになる
ここはトップページです
CGIのページは <a href="./cgi/cgi.html">こちら</a> です
<a href="./cgi/cgi.html"> は <a href="cgi/cgi.html"> と書いても構わない
反対に、「cgi.html」 から 「index.html」 へ移動する場合は、
ここはCGIページです
トップページは <a href="../index.html">こちら</a> です
よく見ないとわからないが、ドット(ピリオド)が二個ある
一個は下、二個は上 と覚えておく
また、「ファイル名」のところで記したが、index.htmlは省略できるので、
トップページは <a href="../">こちら</a> でも構まない

今度は、「index.html」 から 「date-cgi.htm」 へ移動する場合
ここはトップページページです
DATA-CGIページは <a href="./cgi/data-cgi/data-cgi.html">こちら</a> です
反対に、「date-cgi.htm」 から 「index.html」 へ移動する場合は、
ここはDATA-CGIページです
トップページは <a href="../../index.html">こちら</a> です

それでは、「cgi.htm」 から 「css.htm」 へ移動する場合はこうなる
ここはCGIページです
CSSページは <a href="../css/css.html">こちら</a> です

また、「cgi.htm」 から 「data-css.htm」 へ移動する場合はこうです。
ここはCGIページです
DATA-CSSページは <a href="../css/data-css/data-css.html">こちら</a> です

最後に、「data-cgi.htm」 から 「data-css.htm」 へ移動する場合は、
ここはDATA-CGIページです
DATA-CSSページは <a href="../../css/data-css/data-css.html">こちら</a> です

同じページ内の特定の場所に移動したい時は、
<a href="#移動先A">移動先Aに移動</a>
移動先の箇所に、
<a name="移動先A"></a>


別のページ内(sample.html)の特定の場所に移動したい時は、
<a href="sample.html#移動先B">移動先Bに移動</a>
移動先ファイル内の移動箇所に、
<a name="移動先B"></a>


---- End ----

↑PageTop その他にもどる