『INTERNET ホームページ快適作成テクニック』

Part.1

Chapter.2−6
●キーコンセプト：フォーム＆フレームの処理


　次章で、ホームページでCGIを利用する方法を解説するが、CGIを利用することによって、ホームページを訪れたユーザーがアンケートに記入したり、あるいは掲示板のようなシステムを作成してリアルタイムで書き込みを楽しむ、といったことが可能になる。
　これらホームページを見ているユーザーに、チェックボタンやリストをチェックさせたり、あるいは文字列を書き込んでもらったりするときに利用するのがフォームである。
　さらに、ブラウザによっては開いているブラウザの画面を分割し、それぞれの画面に別々のテキストやイメージを表示させることもできる。これがフレーム。最近のちょっと凝ったホームページでは、このフレーム機能を利用したページも多い。


◆FORM……フォームの定義
【書式】<FORM ACTION="URL" METHOD="mesod" ENCTYPE="type">〜
                                                        </FORM>  
【機能】フォームを定義する。
【解説】ホームページを見ているユーザーが、ボタンを押したり書き込みを行なったりできるよう、フォームを定義するタグ。
　ACTION、METHOD、ENCTYPEの３つのアトリビュートがあり、これらの属性を指定することでさまざまな機能が実現できる。各アトリビュートの指定方法と機能は、次のようになっている。

・ACTION
　通常、FORMタグを利用してユーザーにボタンを押させたり、あるいは書き込みを行なわせたりするとき、これらのデータはCGIを使って処理される。このCGIスクリプトのURL、あるいはメールとして転送するためのメールアドレスを、このACTION属性で設定する。
　ACTIONで指定するのは、CGIスクリプトの位置（URL）、またはメールアドレスのどちらか。たとえばURLを指定する場合は、次のように記述する。
    <FORM ACTION="/cgi-bin/post-query" METHOD="POST">
　この場合、CGIスクリプトとしてサーバーのcgi-binディレクトリ内のpost-queryが利用されることになる。METHOD属性も指定しているが、これはサーバーにフォームデータを渡すための指定（後述）。
　メールアドレスを指定するときは、次のように記述すればいい。
    <FORM ACTION="mailto:Name@address" METHOD="POST">
　メールアドレスにフォームデータを送信させるには、ACTION属性に"mailto:"と指定し、さらに送信先のメールアドレスを記述しておく。ここでもMETHOD属性を指定しているが、やはりデータを転送する場合はこの指定にしておく。
　なお、メールとして送信されたものは、英文では正しく表示されるものの、日本語のものは文字化けしてしまう。このため日本語のものを正しく表示させるためにはCLIP-Decodeなどのコンバートプログラムを利用する必要がある。

・METHOD
　フォームデータをサーバーに渡すためのメソッドの指定。次の２つのうちのいずれかを指定する。
    GET ：フォームデータをACTIONのURLに加えて送信する。
    POST：フォームデータをACTIONのURLに受け渡す
　たいていの場合、POSTを利用することになる。CGIスクリプトやメールとして転送するときはPOSTを利用するため、GETを使うことはほとんどない。
　なおこのGETやPOSTは、大文字でなければ認識されないブラウザもあるので注意。

・ENCTYPE
　フォームデータを個別のファイルとして転送する指定。INPUT、SELECT、OPUTION、TEXTAREAの各タグ（後述）で指定したデータを、個別のファイルとして転送する指定で、パラメータとして「multipart/form-data」を指定する。


◆INPUT……入力エリアの表示
【書式】<INPUT TYPE="type" NAME="name" VALUE="name" SIZE=n
			   MAXLENGTH=n CHECKED SRC="Filename">
【機能】フォームの基本的なタグで、テキストボックスやボタンなどを表示  
        する。
【解説】INPUTタグは、フォームのもっとも基本的なタグで、テキストボックスや送信ボタンといったものを表示するもの。前項のFORMタグでフォームを定義し、このINPUTタグでさまざまなボックスやボタンを表示する。ここに入力されたものやアクションが、CGIに渡されることになる。
　INPUTタグには、次のようなアトリビュートがある。

・TYPE="type"
　表示される機能を指定する。指定できるものには、次のものがある。なお、TYPE属性を省略した場合は、textが指定されたものとみなされる。
    text     ：テキスト入力
    password ：パスワード入力
    checkbox ：項目を複数選択するチェックボックス
    radio    ：項目を１つ選択するラジオボタン
    image    ：イメージの座標
    hidden   ：サーバーにのみ渡されるデータの記述
    submit   ：送信ボタン
    reset    ：リセットボタン
    file     ：ファイル名入力ボックス
　これらの機能を配置することで、フォームにさまざまな機能を付加できるわけだ。また、後述する各アトリビュートを指定することで、やはり入力フィールドの大きさを設定したり、あるいは送信されるデータを指定したりすることになる。
　各機能をすべて配置したソース例と、その画面例を掲載しておくから、どのような表示になるのか確認しておくといい。


【ソース例】
    <FORM ACTION=cgi-bin/post-query "METHOD="POST">
    テキストボックス<INPUT TYPE="text" NAME="name"><P>
    パスワード入力<INPUT TYPE="password" NAME="password"><P>
    チェックボックス<BR>
    <INPUT TYPE="checkbox" NAME="check1">チェック(1)<BR>
    <INPUT TYPE="checkbox" NAME="check2">チェック(2)<BR>
    <INPUT TYPE="checkbox" NAME="check3">チェック(3)<P>
    ラジオボタン<BR>
    <INPUT TYPE="radio" NAME="radio1" VALUE="1">ラジオボタン(1)<BR>
    <INPUT TYPE="radio" NAME="radio2" VALUE="2">ラジオボタン(2)<BR>  
    <INPUT TYPE="radio" NAME="radio3" VALUE="3">ラジオボタン(3)<P>
    イメージ<BR>
    <INPUT TYPE="image" NAME="image" SRC="sample.gif">
    イメージ<P>
    サーバーにのみ渡されるデータ<BR>
    <INPUT TYPE="hidden" NAME="hidDen"><P>
    送信ボタン<BR>
    <INPUT TYPE="submit" NAME="sub1" VALUE="送信(1)">
    <INPUT TYPE="submit" NAME="sub1" VALUE="送信(2)">
    <INPUT TYPE="submit" NAME="sub1" VALUE="送信(3)"><P>
    リセットボタン<BR>
    <INPUT TYPE="reset" VALUE="リセット(取消)"><P>
    ファイル名入力:<INPUT TYPE="file" NAME="filename"><P>
    </FORM>


【画面例】
テキストボックス

パスワード入力

チェックボックス
チェック(1)
チェック(2)
チェック(3)

ラジオボタン
ラジオボタン(1)
ラジオボタン(2)
ラジオボタン(3)

イメージ
イメージ

サーバーにのみ渡されるデータ

送信ボタン

リセットボタン

ファイル名入力:


・NAME="name"
　データ名の指定。INPUTタグで入力されたデータが、CGIスクリプトなどに受け渡されるときに使われるデータ名を指定する。
　このNAME属性が設定されていないと、ユーザーが入力したデータはCGIスクリプトなどに転送できなくなってしまうので、必ず指定すること。

・VALUE="name"
　ボタンなどの初期値や名前などを設定するアトリビュートだが、TYPE属性で指定した機能によって動作が異なる。
    text、password
    　テキストボックス内に初期値として表示されているデータを指定する。
      ユーザーがデータを変更していない場合は、この文字列が転送される。

【ソース例】
        <FORM ACTION=cgi-bin/post-query "METHOD="POST">    
        テキストボックス１<BR>
        <INPUT TYPE"text" VALUE="最初のテキスト"><P>
        パスワード１<BR>
        <INPUT TYPE"password" VALUE="1234567890"><P>
        テキストボックス２<BR>
        <INPUT TYPE"text"><P>
        パスワード２<BR>
        <INPUT TYPE"password"><P>
        </FORM>


【画面例】
テキストボックス１

パスワード１

テキストボックス２

パスワード２


    checkbox、radio
    　チェックボックスまたはラジオボタンでVALUE属性が設定されるときは、
    　ボタンがチェックされているときに転送されるデータを指定する。
    　VALUE属性が設定されていない場合は、「フィールド名on」が転送され
    　る。

    hidden
    　hidden属性が指定されている場合は、VALUE属性で指定されているデー
    　タがフィールド名に続いてそのまま転送される。　

    submit、reset
    　送信ボタンやリセットボタンに表示されるボタン名を、VALUE属性で設
    　定する。
      VALUE属性を省略した場合は、リセットボタンの場合は「Reset」と表示
    　され、送信ボタンの場合は「Submit Query」と表示される。

・SIZE=n
　ボックスの横幅を指定する。テキストボックス、パスワード、ファイル名入力の各ボックスの場合に有効で、入力ボックスの横幅を、半角文字数で指定する。省略した場合は、半角20文字分の幅となる。
　また、指定したテキストボックスのサイズが、オープンしているブラウザの横幅よりも大きい場合は、ブラウザ画面にスクロールバーが表示される。
　なお、テキストボックスに入力した文字が、指定されたサイズより大きい場合は、自動的に文字がスクロールするから心配ない。

【ソース例】
        <FORM ACTION=cgi-bin/post-query "METHOD="POST">    
        サイズ20
        <INPUT TYPE="text" SIZE=20><P>
        サイズ200
        <INPUT TYPE="text" SIZE=200><P>
        サイズ2
        <INPUT TYPE="file" SIZE=2><P>
        </FORM>


【画面例】
サイズ20

サイズ200

サイズ2


・MAXLENGTH=n
　テキストボックスやパスワード入力ボックス、ファイル名入力ボックスなどのボックスに入力できる文字の、最大文字数を設定する。
　nに指定できるのは１以上の整数で、最大文字数を指定。この文字数を超えると、それ以上文字が入力できなくなる。MAXLENGTHを省略した場合は、文字数制限はなくなる。
　ただし、ファイル名入力の場合に[Browse...]ボタンでファイルを選択した場合は、MAXLENGTHが設定されていても文字数制限はなくなる。

・CHECKED
　チェックボックスやラジオボタンを配置したとき、これらのボタンの初期値をオンの状態にする。

・SRC="Filename"
　イメージを指定するアトリビュート。TYPEアトリビュートでimageを指定すると、インラインイメージが表示されるが、ここで表示されるイメージのURLまたはファイル名を指定する。

◆SELECT……選択リストの作成
【書式】
【機能】複数のリストが表示できる選択リストを作成する。
【解説】項目が複数あるリストを表示し、そのなかからユーザーが選択可能なフォームを表示するタグ。
　説明するよりも、実際のブラウザ画面表示を見てもらったほうがわかりやすいが、いくつかの選択項目があるとき、このタグを利用して選択リストを作成し、ユーザーに選択させることができる。
　ただし、SELECTタグはリスト名をNAMEで指定し、さらに具体的に選択項目として表示されるものをOPTIONタグで設定し、それらをタグで囲んではじめて実現するもの。書式を間違えないように。
　SELECTだけでは、選択リストは作成できない。次に説明するOPTIONタグが必要だが、SELECTには次のようなアトリビュートを指定する。必須アトリビュートもあるので注意していただきたい。
　なお、ソース例と画面表示を掲載しておくので、ソースを見てどのように指定すればいいか把握しておくといい。

・NAME
　SELECTタグを利用した選択リストでは、選択されたものをCGIスクリプトなどに渡す必要がある。どの項目が選択されているかわかるよう、NAMEアトリビュートを指定する、必須アトリビュートだ。
　たとえば、次のように記述すればいい。
    <SELECT NAME="list">
    <OPTION>選択項目１
    <OPTION>選択項目２
    <OPTION>選択項目３
    .
    .
    .
    </SELECT>
・SIZE
　SELECTタグでは、同時に表示されるリスト項目数を設定することもできる。これがSIZE属性。SIZEに続けて行数を記述する。
　ただし、記述した行数の項目がブラウザ画面に表示されるわけではない点に注意。また、ブラウザによっても表示が異なっている。たとえばInternet Explorer2.0では指定したSIZEの値より１行少ない行数が画面に表示されるし、Netscape Navigator2.0では指定したSIZE数より１行多い行数が表示される。さらにInternet Explorer3.0やNetscape Navigator3.0では、指定した値と同じ行数が表示される。
　たとえば、次のように指定した場合の、Internet ExplorerとNetscape Navigatorの画面表示の違いを確認しておくといい。

【ソース例】
    選択リスト：
    <SELECT NAME="list" SIZE=5>    
    <OPTION>選択項目１
    <OPTION>選択項目２
    <OPTION>選択項目３
    <OPTION>選択項目４
    <OPTION>選択項目５
    <OPTION>選択項目６
    <OPTION>選択項目７
    </SELECT>


・MULTIPLE
　リストの複数項目の選択を可能にするアトリビュート。選択リストでは、何も指定しない場合は、ユーザーが選択できる項目は１つのみとなっている。MULTIPLE属性を指定しておくと、ユーザーが[Shift]キーを押して選択すると、複数の項目を選択することができるようになる。

【ソース例】
    <SELECT NAME="list" SIZE=5 MULTIPLE>    
    <OPTION>選択項目１
    <OPTION>選択項目２
    <OPTION>選択項目３
    <OPTION>選択項目４
    <OPTION>><OPTION>選択項目６
    <OPTION>選択項目７
    </SELECT>


◆OPTION……選択リストの選択項目
【書式】<OPTION>〜
        <OPTION SELECTED>〜
        <OPTION VALUE="n">〜
【機能】選択リストの項目の設定。
【解説】SELECTタグで作成する選択項目リストの、各選択項目を設定するタグ。<SELECT>と</SELECT>で囲まれたなかで設定するタグで、各項目を<OPTION>につづけて記述する。
　このタグには、次の２つのアトリビュートがある。

・SELECTED
　このアトリビュートで指定した項目を、初期値を選択済みに設定する。選択リストでは、通常は何も選択されていない状態になっている。このなかから項目を指定して、ユーザーが選択するわけだが、初期値としていずれかの項目を選択済みに設定しておきたいときもある。
　そんなときに選択済み項目として指定したい項目に、SELECTEDアトリビュートを記述しておけばいい。

【ソース例】
    選択リスト（初期値３）：
    <SELECT NAME="list" SIZE=5 MULTIPLE>    
    <OPTION>選択項目１
    <OPTION>選択項目２
    <OPTION SELECTED>選択項目３
    <OPTION>選択項目４
    <OPTION>選択項目５
    <OPTION>選択項目６
    <OPTION>選択項目７
    </SELECT>


・VALUE
　選択値を設定するアトリビュート。選択リストの各項目を、OPTIONタグによって設定するが、ユーザーが選択したものはリストに表示されている文字列がそのままCGIスクリプトなどに渡される。
　ところが、スクリプトに渡されるデータは、何もリストに表示されている文字列である必要はない。ときには簡単な数字やアルファベットでもいいはずだ。
　たとえば、アンケートで何番を選択したかがわかればいい、というケースだってあるはず。こんなときは、項目の文字列を送信するのではなく、その項目の番号が送られていればいい。
　このような利用法のため、VALUEには数値やアルファベットなどを記述しておけばいい。たとえば次のように記述するといいだろう。

【ソース例】
    <SELECT NAME="list" SIZE=5 MULTIPLE>    
    <OPTION VALUE="1">選択項目１
    <OPTION VALUE="2"><OPTION VALUE="3">選択項目３    
    <OPTION VALUE="4">選択項目４
    <OPTION VALUE="5">選択項目５
    </SELECT>


◆TEXTAREA……テキストボックス・フィールド
【書式】<TEXTAREA NAME="name" ROWS=n COLS=n
                WRAP="off/virtual/physical">〜</TEXTAREA>    
【機能】テキストボックス・フィールドを作成する。
【解説】アンケートなどで、ユーザーに自由に文章を入力してもらいたいときは、複数行にわたって入力できる大きめのテキストボックスを設定したい。それを可能にするのがTEXTAREAタグだ。
　TEXTAREAタグを設定すると、複数行にわたって文字列が入力できるボックスフィールドが作成される。ボックスにはスクロールバーが表示される。
　さらに、<TEXTAREA>と</TEXTAREA>タグではさまれた部分に文字列を記入しておくと、その文字列がボックスフィールド内に入力された状態で、ブラウザに表示される。
　また、このタグでは大きさを指定することもできるから、あらかじめ入力エリアの大きさを指定しておくと、ユーザーが入力した文字列や文章をブラウザ上で確認しやすいだろう。
　ボックスフィールドの大きさを指定したりするためには、次のようなアトリビュートを指定する。

・NAME="name"
　ユーザーが入力した文字列や文章を、CGIスクリプトなどに渡すためのデータ名を指定する。これを指定しないと、入力されたデータの識別が行われないので、必ず指定すること。

・ROWS=n
　ボックスフィールドの上下の高さを指定する。nには整数値を記述する。この整数値が、ボックスフィールドの行数となって表示される。

・COLS=n
　ボックスフィールドの横幅を指定する。やはりnには整数値を記述するが、これはボックスフィールドの横幅の調整値で、表示文字数とは厳密な関連はないので注意。

・WRAP="off/virtual/physical"
　Netscape Navigatorで有効なアトリビュートで、入力エリアでの改行方法を指定するもの。Internet Explorer3.0以降でも有効。指定できるのは次の３種となっている。
    off     : フィールドの右端までいっても折り返さない。
    virtual : フィールドの右端までいったら自動的に改行する。ただし、送
              信データには改行情報を含まない。
    physical: フィールドの右端までいったら自動的に改行する。送信データ
              には改行情報も含まれる。
　なお、このWRAPアトリビュートを設定しない場合は、offが指定されているときと同じ動作となる。

【ソース例】
    <FORM ACTION="cgi-bin/post-query" METHOD="POST">
    テキストフィールド・ボックス<BR>
    <TEXTAREA NAME="text" ROWS=5 COLS=60 WRAP="virtual">
    ここに文章を入力してください。なお、この文章は初期設定    
    で記述されているものです。
    </TEXTAREA>
    </FORM>


【画面例】
テキストフィールド・ボックス

◆FRAMESET……フレームの分割
【書式】<FRAMESET ROWS=n%,m%,../COLS=n%,m%,..>〜</FRAMESET>
【機能】ページを複数のフレームに分割し、各フレームに別々のHTML    
        ファイルを表示させる。
【解説】ブラウザに表示されるページを、複数のフレームに分割し、それぞれのフレームで別々のHTMLファイルを表示させるためのタグ。ただし、Internet Explorer3.0以降とNetscape Navigatorで実現されているもので、Internet Explorer2.0では無視されるので注意。
　最近では、ちょっと凝ったページを作成するのによく利用されているタグで、画面を分割する比率を変更することで、自由に画面を分割し、それぞれ別々のファイルを表示させることができる。また、フレームに表示されている各ファイルは、それぞれ独自に動かすこともできるため、かなり凝ったページ作りが行なえる。
　ただし、CRTに表示されるブラウザのウィンドウは、それほど大きくはない。たくさん分割すると、そのぶん見にくくなってしまうことも少なくないので、フレーム分割はほどほどにしたい。
　フレームの分割には、縦分割と横分割がある。ブラウザの縦に対してどう分割するか、つまり上下をどう分割するか、また横（左右）をどう分割するかといった指定が必要だ。それらは次のアトリビュートで指定する。

・ROWS
　フレームの上下分割の指定。上下方向をどう分割するかを、フレームの割合（パーセンテージ）で指定する。たとえば、上を20％、下を80％で分割したい場合なら、次のように記述すればいい。
    <FRAMESET ROWS=20%,80%>
　上から順に20％と80％と記述し、それぞれカンマで区切っておく。また、フレームの割合は、すべてを合計したとき100％になるように設定する必要がある。上下を10％、20％、70％の３分割にしたければ、次のように記述する。
    <FRAMESET ROWS=10%,20%,70%>
　なお、次のCOLS属性にも関連するが、分割したフレーム内をさらに分割したい場合は、入れ子で記述していけばいい（ソース例参照）。

・COLS
　フレームの左右分割の指定。フレームの横幅に対して、どの程度の割合でフレームを分割するかを指定する。ROWSと同じように、左から順にパーセンテージで指定していけばいい。
　たとえば、左から10％、70％、20％の３分割にしたければ、次のように記述すればいい。
    <FRAMESET COLS=10%,70%,20%>
　なお、ROWSもCOLSの場合も同様だが、それぞれのフレームに指定したHTMLファイルが、フレーム内に収まらない場合は、そのフレームには自動的にスクロールバーが表示される。
【ソース例】
    <HTML>
    <FRAMESET ROWS=30%,50%,20% COLS=100%>    
    <FRAME SRC="1.html">
        <FRAMESET COLS=10%,70%,20%>
        <FRAME SRC="2.html">
        <FRAME SRC="3.html">
        <FRAME SRC="4.html">
        </FRAMESET>
    <FRAME SRC="5.html">
    </FRAMESET>
    </HTML>


◆FRAME……フレーム内容の定義
【書式】<FRAME SRC="url" NAME="name" MARGINWIDTH=n    
               MARGINHEIGHT=n SCROLLING="yes/no/auto" NORESIZE>  

【機能】FRAMESETタグで分割したフレームの、それぞれの内容を定義する
        タグ。
【解説】FRAMESETタグを利用して、ページ内の上下左右をいくつかに分割することができるが、その分割したそれぞれのフレームに表示されるHTMLファイルを、FRAMEタグで指定する。
　FRAMEタグを利用してHTMLファイルを指定しておかないと、フレームが分割されているのに、内容がまったく表示されないフレームができてしまうこともあるので注意。
　また、次のようないくつかのアトリビュートを指定し、見やすいページに仕上げることもできる。

・SRC
　必ず指定する必要があるアトリビュートで、分割したフレームのそれぞれが表示するHTMLファイルを指定する。
　分割されたフレームのどこに割り当てられるかは、順番が決っている。左右に分割した場合は、左から右へ。上下に分割した場合は、上から下へ、という順番になる。上下左右に分割した場合は、まず上のフレームの左から右へ、次ぎにその下のフレームのやはり左から右へ、という順番になる。どのフレームといった指定はないので、SRCの記述を間違えないよう注意したい。

・NAME
　SRCとともにNAMEを指定することで、セル（分割されたフレーム）に名前をつけることができる。
　名前をつけても、それはブラウザに記録されるだけのことだが、この名前を使ってHTMLファイルを表示するフレームをターゲットとして指定することができる。

・MARGINWIDTH
　指定されているフレームに、指定したHTMLファイルを読み込んで表示するが、そのHTMLファイルをフレーム内に表示するときの左右の余白を指定するアトリビュート。ピクセル単位で指定し、指定したピクセル値が左右に余白として設定される。
　フレームの境界に文字がかかる場合、文字が読みにくくなりがちだが、このアトリビュートで余白を設定しておくと、画面が見やすくなる。
　ただし、通常は次のMARGINHEIGHTアトリビュートとともに設定するもので、両者を省略すると上下左右ともに10ピクセルの余白が自動的に設定される。また、どちらか片方のアトリビュートを省略すると、省略されたほうの余白は0に設定されてしまう。

・MARGINHEIGHT
　HTMLファイルをフレーム内に表示するときの、上下の余白をピクセル単位で設定する。設定方法などは前項を参照していただきたい。

【ソース例】
    ・余白を設定した場合
    <HTML>
    <FRAMESET ROWS=20%,60%,20% COLS=100%>
    <FRAME SRC="1.html">
        <FRAMESET COLS=10%,70%,20%>
        <FRAME SRC="12.html" MARGINWIDTH=20 MARGINHEIGHT=10>
        <FRAME SRC="3.html">
        <FRAME SRC="14.html" MARGINWIDTH=20 MARGINHEIGHT=10>
        </FRAMESET>
    <FRAME SRC="5.html">
    </FRAMESET>
    </HTML>


    ・余白を設定しなかった場合
    <HTML>
    <FRAMESET ROWS=20%,60%,20% COLS=100%>
    <FRAME SRC="1.html">
        <FRAMESET COLS=10%,70%,20%>
        <FRAME SRC="12.html" MARGINHEIGHT=10>
        <FRAME SRC="3.html">
        <FRAME SRC="14.html" MARGINWIDTH=10>
        </FRAMESET>
    <FRAME SRC="5.html">
    </FRAMESET>
    </HTML>


・SCROLLING
　フレームセルのスクロールバーの表示をどうするかの設定。画面を分割すると、小さいフレームも作れる。この小さなフレームにHTMLファイルを読み込んだ場合、ファイルによっては画面に表示しきれない場合もある。そんなときは自動的にスクロールバーが表示され、バーを操作することで表示されていない部分を読むことができるが、このスクロールバーを意図的に表示させないよう設定することもできる。
　このスクロールバーを表示するかどうかを、次の設定値で指定する。
    yes : スクロールバーを表示する。読み込んだHTMLファイルの内容に関わ
          らず、常にスクロールバーが表示される。
    no  : スクロールバーを表示しない。読み込んだHTMLファイルの内容によ
          っては、画面に表示されない部分も出てくるが、スクロールバーが
          表示されないため、はみ出した部分を読むことはできない。
    auto: 読み込んだHTMLファイルによってフレームからはみ出すようならス
          クロールバーが自動的に表示される。
・NORESIZE
　FRAMESETタグで、フレームを上下左右に分割することができ、またそれらのフレームの割合を指定できるが、こうしてブラウザに表示されたフレームは、ユーザーがフレームの境界にマウスカーソルを合わせてドラッグすれば、自由に大きさを変更することができる。
　ところが、場合によってはユーザーにフレームの大きさを変更させたくないケースもあるだろう。そんなときNORESIZEアトリビュートを設定しておくといい。
　NORESIZEアトリビュートにはパラメータはなく、FRAMEタグのなかに記述しておくだけ。これでユーザーがフレームの境界をドラッグして、フレームの大きさを変更するという操作ができなくなる。

◆NOFRAME……フレーム未対応ブラウザでの表示指定
【書式】<NOFRAME>〜</NOFRAME>
【機能】フレームに未対応のブラウザで表示される内容の指定。
【解説】Internet Explorer3.0やNetscape Navigatorでは、FRAMESETタグによって分割されたページを正しく表示することができるが、Internet Explorer2.0以前のものなどではフレームに対応せず、正しく表示できないブラウザもある。それらのブラウザ利用者のために設定するタグで、フレーム未対応のブラウザを利用しているときに表示される内容を設定するタグ。
　<NOFRAME>と</NOFRAME>タグにはさまれている部分が、フレーム未対応ブラウザで表示される内容となる。ここにフレーム未対応のブラウザのときに表示される文字列や、あるいはこれらのブラウザを利用している場合のジャンプ先URLなどを指定しておくといい。

【ソース例】
    <HTML>
    <FRAMESET ROWS=30%,50%,20% COLS=100%>
    <FRAME SRC="1.html">
        <FRAMESET COLS=10%,70%,20%>
        <FRAME SRC="2.html">
        <FRAME SRC="3.html">
        <FRAME SRC="4.html">
        </FRAMESET>
    <FRAME SRC="5.html">
    </FRAMESET>
    <NOFRAME>
    フレームに未対応の場合は、ここが表示されます
    </NOFRAME>
    </HTML>


[目次]

Copywrigth (C) 1996 by Kazumi Takei. All Rights Reserved.