1．他のページにジャンプする
<a href=*>〜</a>
<a href="*">タグで文字列や画像を挟むと、その文字列や画像はリンクボタンになります。
そのボタンをクリックすれば、指定されたページにジャンプします。
*には、ジャンプ先のURLを指定します。(ジャンプ先のソースファイルが同じフォルダに存在する時は、ファイル名を指定するだけでも大丈夫です。)
<html>
<head>
</head>
<body>
<a href="http://www.scn-net.ne.jp/~zeit/homepage/hp6-1a.html">
ページAへジャンプ</a><br>
ジャンプ先のソースファイルが同じフォルダに存在する時は
ファイル名（ここでは"hp6-1a.html"）を指定するだけでも良い。
↓は、その例です。
<br>
<a href="hp6-1a.html">これでもOK!!</a>
</body>
</html>
|
⇒サンプル |
ジャンプ先のソース(hp6-1a.html)
<html>
<head>
</head>
<body>
<h1>このページがリンクされたページです。</h1>
</body>
</html>
|
|
2．同じページ内のリンク
<a href="#*">〜</a>
<a name="*">〜</a>
文章がとても長い時などに有効なタグで、<a href="#*">〜</a>ではさんだ文字列をクリックすると、<a name="*">〜</a>のところまで、ジャンプするというものです。
ちょっと、分かりづらいと思いますので、実際にサンプルを見てみてください。
ちなみに、*にはどのような文字を入れても構いませんが、ジャンプ先を分かりやすくするような文字を入れておくといいでしょう。
<html>
<head>
</head>
<body>
<a href="#mon">月曜日へジャンプ</a><br>
<a href="#tue">火曜日へジャンプ</a><br>
<br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br>
<a name="mon">月曜日</a><br>
今日は月曜日、ジャンボ尾崎の髪型が気になった。<br>
<br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br>
<a name="tue">火曜日</a><br>
今日は火曜日、おすぎとピーコの親の顔が気になる。<br>
<br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br>
</body>
</html>
|
⇒サンプル |
|
3．リンク先のページを別のウインドウに表示
<a href="*" target="◇">〜</a>
普段、リンクされたページというのは、そのリンクボタンがあったページに表示されます。しかし、<a href="*" target="◇">〜</a>で、targetを指定することによって、リンク先のページを新しいウインドウなどに表示することが出きるようになります。◇に_selfと指定すればリンクボタンと同じウインドウに、◇に_blankと指定すれば新しいウインドウにリンク先のページが表示されます。
*には、リンク先URL
◇には、_self、_blank
<html>
<head>
</head>
<body>
<a href="hp6-3a.html" target="_blank">
新しいウインドウでジャンプ</a><br>
<a href="hp6-3a.html" "target=_self">
同じウインドウでジャンプ</a><br>
</body>
</html>
|
⇒サンプル |
ジャンプ先のソース(hp6-3a.html)
<html>
<head>
</head>
<body bgcolor="#48d1cc">
<center>
<font size="+2">
知り合いの方のページにリンクする場合などは、<br>
新しいウインドウでジャンプしたほうが良いようです。
</font>
</center>
</body>
</html>
|
|
4．メールボタンの作成
<a href="mailto:*">〜</a>
上記のタグを使うことによって、メールボタンを作ることができます。
ボタンを押すとメールが送れるヤツです。
*には 自分のメールアドレスを指定します。
<html>
<head>
</head>
<body>
<a href="mailto:zeit2000@mail.goo.ne.jp">
なにか質問・ご意見ありましたら、こちらへ</a>
</body>
</html>
|
⇒サンプル |
|