HTML講座 第八回目
 1限目 (The フレーム)
 またまた、大変長らくお待たせしてしまいまして、どうもすみません (^^;
 でも、やっとこうして開講することができました・・・

 ということで、今回はフレームの使い方についてです。

● それでは、講義に入ります。

 まず、ここをクリックして下さい。

 2分割されたフレームが現れましたね。でも、何も表示されていません。
 なぜなら、まずは、フレームを構成するためのHTMLファイルを1つしか用意していないからです。

 この2分割されたフレームの中に、オブジェクトを表示させるには、HTMLファイルを2つ別に用意しなくてはいけません。

 そうです、フレームを2分割する場合には、まず、フレームを構成するためのHTMLファイル(1つ)、そして、2分割されたフレーム内に表示するためのHTMLファイルがそれぞれ2つ、全部で3つのHTMLファイルが必要になるということです。

 どういうこと?と思う方も、すぐに解ります!!

 それでは、今度はこちらをクリックしてみて下さい。

それでは、フレームセットの方法に入ります。

まずは、基本中の基本、画面を左右2分割する方法です。
次の内容のHTMLファイルを作成して、適当なファイル名で保存して下さい。

<html>

<frameset cols="200,100%">
 <frame name="1" src="frame_1.html">
 <frame name="2" src="frame_2.html">
</frameset>

</html>

では、タグの説明です。

1. <frameset cols="200,100%">

この行で、フレームをどうように分裂するのかが書かれています。
「 cols= 」 これは、コラムスパンの略で、フレームを左右に分割するという意味です。
上下に分割するには、ここの部分を 「 rows= 」 に変更して下さい。

 また、「 cols="200,100%" 」は左右に分割したフレームの左側は、幅 200 ドットに固定(絶対指定)、そして、右側の幅は、残り全てといういみです(相対指定)。

 このように幅の広さは、絶対指定あるいは、相対指定、はたまた両方を組み合わせて使うことができます。
 幅の広さが変化してはいけない場合、例えば、「たっちゃんのHP」の左のメニューフレームなどには、絶対指定をしまよう。

2. <frame name="1" src="frame_1.html">

ファイルの分割方法が決まったら、次に、分割した領域内での動作を設定しなくてはなりません。

「 name="1" 」
これは、分割した領域に名前を付けます。ここでは、仮に「1」と付けました。

「 src="frame_1.html" 」
ここで、領域内に呼び出すHTMLファイルの設定をしています。

最後に、</frameset> でフレームタグを閉じます。

これらが、もっとも基本的なフレームセットの方法です。
(ですが、フレームタグは、ホームルームでは使えませんので・・・(^^; )
ふぅ、それではちょっと一休みしましょう。(^_^A)

キーンコーンカーンコーン・・・(1限目終了)


 2限目 (更なるフレームセット)

2限目で〜す!!
この時間は、あんなフレームセットや、こんなフレームセットはどうしたらできるのか?についてです。
ここでは、そのサンプルをいくつか紹介します。
HTMLソースは、開いたブラウザーの 表示 → ソースの表示 で、確認して下さいね。

1.こんなの(基本)

2.あんなの(上下分割)

3.そんなの(左右3分割)

4.This is(上下3分割)

5.That is(3分割A)

6.It is (3分割B)

とこのように、色々な分割を楽しめるのです。

いったいいくつまで、できるのでしょうねぇ???
たっちゃんはそこまでは知りません(^^;

ということで、2限目終了!!


 3限目 (The Linking)

This study is about how to link.
だんだん核心に迫ってきました。ここでは、左のフレームから右のフレームにHTMLファイルを読み込む。
(「たっちゃんのHP」の基本動作ですね。)
それをマスターしましょう。

もう一度ここをクリックして下さい。
そして、左フレームのクリックをクリックして下さい。
どうですか?右側のフレーム内にの表示は変わりました?

やりかたはとっても簡単です。普通、リンクを貼るときの記述は、

<a href="*.html">

でしたね。
これに、もう一つオプション(アトリビュート)を追加するだけで、次のように記述します。

<a href="*.html" target="フレーム名">

この target= によって、表示させたいHTMLファイルを好きなフレームに表示させることができます。
また、これを行うために、分割したフレームにはそれぞれ名前を付けるのです。
名前の付け方は解りますね?解らなかったら、もう一度1限目の復習をしましょう!!

これで、フレームをつかえるようになるはずです。
でも難しいですフレームセットは・・・
じっくり勉強してみて下さいね!!

それでは、今日はここまでです!!


たっちゃんのHTML講座

[Back]