2. リンクとフレームの仕組み

 リンクはアンカーとも言われていますがクリックすると他のページにジャンプする仕組みです。 右の小さな写真には別に大きな画像を用 意してあります。右の小さな画像をクリックして見ましょう。するとページが切り替わり大きな画像に切り替わります。切り替わったら画面を元にもどして下さい。それでこのソーステキストを覗くと右の 画像<IMG src=ファイル名>が次のように<A href=ファイル名>と</A>のタグで挟まれ ていることが分かります。
<A href="image/uzbek.jpg"><IMG src="image/dance.jpg"></A>

<A>と</A>ではさまれた構造の働きがリンクの仕組みです。そこで指定された画像や文字をクリックすれば、ホームページの表 示をhref=""で指定したところにジャンプさせることができます。例えば<A href="image/uzbek.jpg">ダンス</A>とすれば「ダンス」の文字クリックで同様にページが切り替わります。
このリンクの仕組みによって、目次の項目の一つをクリックすれば項目ごとにページが切り替わるようにすることができます。

フレームはホームページの一部を別のページと組み合わせるためにあります。ページごとに目次を作るのではなく目次のページに記事のフレームを作っておきます。これで目次の項目をクリックしたときに、対応する記事をフレームに呼び出すようにすることができます。あるいは逆に各記事のページにフレームを作っておき、そこに目次のページを呼び出すこともできます。いずれでも目次ページを共有することができます。ここでは目次の頁にフレームを作り、記事の項目クリックで記事をフレーム内に読み込む方式にしています。
メニュー より、このページを「名を付けて保存」し「メモ帳」で開いて見ましょう。目次のページが <IFRAME>のタグで 画像と同じように呼び出されてていることが分かります(但しIMGタグと違って終わりの</IFRAME>が必要)。ページ内でのフレーム表示位置やフレームの大きさはフレームタグに記述します。
<iframe src="フレーム内に表示するページのURLアドレス" align="左右中" height="高さ" width="幅"></iframe>

下記もフレームで作った例です。
全面表示 <=ここをクリックすると全画面が表示されるのでソーステキストを見てください。

注:HTNL5ではFramesetが廃止され、インラインフレーム(iframe)だけになりました。