*リンク*

1.リンクをはる

たいていホームページって、
自己紹介のページ」だとか、
ペットの写真館」だとか、
日記」だとかって、
何ページにもわたる場合が多いですね。
そこで、top.htmlを、こんなページにしてみたいと思います〜♪↓

こんなページへGO!!


サイト内のいろんなページにジャンプできる、まさに「トップページ」にするわけです。
↑このページは例なので、クリックしてもどこにもジャンプしません(^^;)メールだけは起動します。

ハイここでキーワードです!
このように、あちこちのページにジャンプさせる機能を、「ハイパーリンク」といいます
(略して「リンク」とよく言われます)。

ではさっそく、リンクをはってみましょう!

top.htmlは、「初めてのホームページです。」で終わっていますが、
その下にリンク文字を付け加えていきますので、とりあえず改行を2つほど入れておきます。

<HTML>
  <HEAD>
    <TITLE>ななたぐのへや</TITLE>
  </HEAD>

  <BODY bgcolor="yellow" text="blue">
      <CENTER><H1>
          <FONT color="red">ななたぐのへや</FONT>
          </H1></CENTER>
      <FONT size="5">「ななたぐのへや」</FONT>へようこそ!<BR>
      初めてのホームページです。
      <BR><BR>
  </BODY>
</HTML>

続いて、まず最初のリンクは「自己紹介」です。
リンクは、 <A HREF="リンク先のHTML名">リンク文字</A> と書きます。

「ん?ややこしいなぁ。」
・・・ちょっと、ややこしいですね。
ま、ためしに、実際に書いてみましょう。そのうち慣れますよ(^-^)

<HTML>
  <HEAD>
    <TITLE>ななたぐのへや</TITLE>
  </HEAD>

  <BODY bgcolor="yellow" text="blue">
      <CENTER><H1>
          <FONT color="red">ななたぐのへや</FONT>
          </H1></CENTER>
      <FONT size="5">「ななたぐのへや」</FONT>へようこそ!<BR>
      初めてのホームページです。
      <BR><BR>
      <A HREF="profile.html">自己紹介</A>
  </BODY>
</HTML>

「profile.html」なんてHTMLは、まだ作ってないんですが、
明日作りますので、とりあえず書いとくだけ書いておいてください(^^;)

さて、いったん上書き保存して、ブラウザで更新して、確認してみましょう。
・「自己紹介」って文字に、下線が引かれてますか?
・「自己紹介」にマウスをもっていくと、カーソルがになりますか?
・ブラウザのステータスバー(下辺の「ページが表示されました。」とか表示されるところ)に、
 「ナントカ/profile.html」と表示されますか?
以上をクリアすれば、成功ですよ(^-^)

続けて、同じように
リンク先 リンク文字
diary.html日記
bbs.html掲示板
link.htmlリンク
というリンクを、つけていってみましょう!
(「link.html」は今日、あとで作りますからね♪)
1個つけるたびに、上書き保存→更新、で確認しましょうね(^-^)

あ、改行、忘れないでくださいね〜!!

「メールはこちら」については、次のページの「3」で解説します!



Copyright (C) 7tag project dv