ホームページ作り入門＜１４＞
スマホやタブレットなどでは上手く作動しないので、フレームは使わない方がよい

フレーム
ページが多くなってくると、ページの切り替えが多くなります。 その都度メニューページに戻っているのは繁雑で苦痛ですらあります。 この入門ページも、その繁雑さを解消する手法としてフレームを使っています。 画面を分割して、分割をしたそれぞれの窓に、別のページを同時に表示します。 しかも、各窓間に関連を持たせて、別の窓からでも入れ替え指令が出来るのが特徴です。 画面は幾つにでも分割できますが、メニュー用とページ表示用に２分割して使う場合が多いので、 それをベースに説明します。 <html> <head> <title></title> </head> <frameset cols="140,*"> <!--フレームの分割サイズ（＊は余り）--> <frame name="hidari"> <!--一番目のフレームに名前を付ける--> <frame name="migi"> <!--二番目のフレームも名前を付ける--> </frameset> <html> と書くと画面がフレームで次のように分割されます。
（フレーム定義ページには＜ＢＯＤＹ＞　～　＜／ＢＯＤＹ＞がありません）


（ネットスケープ４．７以下では表示できません）

初期化


分割された窓にページを呼び込むには＜ｆｒａｍｅ＞タグ内に「ｓｒｃ＝”ファイル名”」と書きます。
具体的には
<frame name="hidari" src="menu.htm"> <frame name="migi" src="top.htm"> と書けばいいのです。
そうすると”ｈｉｄａｒｉ”と名前の付けられた窓に「ｍｅｎｕ．ｈｔｍ」が、 ”ｍｉｇｉ”と名前の付けられた窓に「ｔｏｐ．ｈｔｍ」がセットされます。

ここをクリックしてセットしてください。

左の窓にセットされたページに書いたリンクをクリックして、
別の窓に指定したページを呼び出すには

＜Ａ　ＨＲＥＦ＝”ファイル名”　ＴＡＲＧＥＴ＝”フレーム名”＞

とＴＡＲＧＥＴを使います。
具体的には
<a href="myhp_01.htm" target="migi">①まず体験</a> のように書きます。
上のサンプルには既にＴＡＲＧＥＴオプションが書いてありますのでクリックして体験してください。

フレーム内で別の窓を操作するのはＴＡＲＧＥＴ＝”フレーム名”と書きましたが
同じ窓の中を別のページと入れ替えるのはＴＡＲＧＥＴを省略します。
さらにフレーム外に新しい窓を作って表示することもできます。
その場合は、使っていない（適当な）フレーム名を指定します。

ＴＡＲＧＥＴ＝”使っていないフレーム名”

最後にフレームを解消して他のページに飛ぶ場合は「アンダーバーＴＯＰ」を使い

ＴＡＲＧＥＴ＝”＿ＴＯＰ”

と書きます。
具体的には
<A href="myhp_02.htm"　target="_new">新ｳｲﾝﾄﾞｳ</A> <A href="myhp_145.htm"　target="_top" >ﾌﾚｰﾑ解消</A> のようにかきます。

それではここをクリックし完成ページをセットしてください


（ネットスケープ４．７以下では表示できません）

初期化


上の窓で実際に個々の違いを体験してください。
（新ウインドウで開いた場合はで閉じてください。）

境界線やスクロールバーを消したい

フレームにすると境界線やスクロールバーが真中に入るが、デザイン上消して一体感のあるページにしたいような場合があります。
境界線を消す場合は
＜ＦＲＡＭＥＳＥＴ＞タグ内に

ｆｒａｍｅｂｏｒｄｅｒ＝０

と書きます。
スクロースバーを消したい場合は
該当する＜ＦＲＡＭＥ＞タグの中に

ｓｃｒｏｌｌｉｎｇ＝”ｎｏ”

と書きます。
具体的には
<frameset cols="140,*" frameborder=0 > <frame name="hidari" src="menu.htm"> <frame name="migi" src="top.htm" scrolinng="no"> </frameset> それではここをクリックし完成ページをセットしてください


（ネットスケープ４．７以下では表示できません）

初期化


スクロールバーを消すと、見る人の環境によって、ページの一部しか見えなくなる可能性があるので、慎重に！

ソース
-------フレームページ----------
<html> <head> <title>入門１４</title> </head> <frameset cols="140,*" frameborder=0 > <frame name="hidari" src="menu.htm" scrolling="no"> <frame name="migi" src="top.htm"> </frameset> </html>
-------メニューページ----------
<html> <head> <title>ｍｅｎｕ</title> <body> <center> <b>HP入門講座</b> <hr> </center> <li><a href="myhp_00.htm" target="migi">◎はじめに</a><br> <li><a href="myhp_01.htm" target="migi">①まず体験</a><br> <li><a href="myhp_02.htm" target="migi">②作成環境</a><br><br> <li><a href="myhp_03.htm" target="_new">新ｳｲﾝﾄﾞｳ</a><br><br> <li><a href="myhp_145.htm" target="_top">ﾌﾚｰﾑ解消</a><br> </body> </html>
-------個々のページ----------
省略