|
初級篇★ページ作りの基礎知識1. HTMLを書いてみよう VOL6.フレームページを作ってみよう その７.インラインフレームを使ってみよう **NETSCAPE はインラインフレームに対応していないため、このページ内のフレーム部分は表示されていません。**
フレームを使っていないページ内に、下のように窓が空いていて、その窓の内容は下にスクロールして見れるようになっているページを見かけたことはありませんか。これを「インラインフレーム」と呼び、ページ全体をフレーム仕立てにするのではなく、通常のページの一部にフレームを組み込んで、そこに別のHTML文書を呼び出す方法として広く使われています。ただし、前章までの内容は、IE、Netscape に関する限り、概ね意図した通りに表示されますが、Netscapeはインラインフレームに対応していません。そのためこのページを、未対応ブラウザで見ておられると、フレームの代わりにメッセージが表示されているはずです。なお、作成ソフトによってはインラインフレームはブラウザで見た時だけ表示され、作成画面にはメッセージのみが表示されている場合もあります。このような時は、ブラウザでチェックするようにしましょう。
このスクリプトは以下のように<IFRAME>〜<IFRAME> で挟み込まれており、この間にメッセージを書き込むと、未対応ブラウザに対しては、そのメッセージのみが表示されます。このメッセージの中に、下の例のようにこのフレームに表示されるはずのページへのリンクを付けておけば、未対応の方にも内容をご覧頂けるようになります。 <IFRAME SRC="framesamplepage2.htm" width="400" height="200" marginwidth="50" marginheight="50" frameborder="0">
インラインフレームに未対応のブラウザをお使いですと、フレームは表示されません。 </IFRAME>
基本的には、 <IFRAME SRC="表示するページのファイル名（orパス）" width="幅（ピクセル）" height="高さ（ピクセル）"> </IFRAME> 以上で、設定した大きさの枠に指定のページ内容が表示される状態になりますが、<IFRAME...>タグ内に、以下のような内容を書き込むと、それぞれの設定に応じて表示状態が代わります。 ★MARGINWIDTH="フレーム内の左右マージンを指定（単位 : ピクセル）" ★MARGINHEIGHT="フレーム内の上下マージンを指定（単位 : ピクセル）" ★SCROLLING=" yes (no, auto)" ... スクロールバーの表示・非表示を指定 ※yes （表示）、no （非表示）、auto（自動）... 何も書き込まなければauto と同じ状態になります。 ★FRAMEBORDER="1 or 0" ※上の例ではFRAMEBORDERを指定していませんので、枠線が表示されていますが、FRAMEBORDER="0"とすると、以下のように周囲の枠が表示されません。ちなみにFRAMEBORDER="1"とすれば、書き込まない時と同じ状態になります。
★ALIGN="left (center, right)"... フレームの位置を指定。 ※left, right で指定するとテキストが右、または左に回りこみます。centerでは、フレームが中央に表示されます。 なお、テキストとフレームとの間隔は、画像と同じようにVSPACE="数値" HSPACE="数値"を書き加えることによって、いずれもピクセル単位で設定できます。横のフレームには、 <IFRAME SRC="framesamplepage2.htm" width="400" height="200" marginwidth="50" marginheight="50" ALIGN="left" VSPACE="10" HSPACE="20"> 以上のように書き込まれているので、このような表示になるわけです。
★NAME="任意の名前" ... このフレームに任意の名前を付けておくことによって、フレームの外でリンクがクリックされた時の表示先をここに指定することが出来るようになります。例えば... <IFRAME SRC="framesamplepage2.htm" NAME="content" width="400" height="200" marginwidth="50" marginheight="50" > このようにしておいて、フレーム外のリンクに <a href="framesamplepage5.htm" target="content">こちら</a>をクリック target="任意の名前" と指定すれば、このリンクがクリックされた時、内容はフレーム内に表示されるようになります。実際にどのようになるか、以下でお試し下さい。 こちらをクリック 今度はこちらをクリックすると切り替わります。 以上で、フレームに関する項目はおしまいです。フレームを使うと、なかなか凝った見栄えになりますので、自由にレイアウトして楽しいページを作って下さいね。
初級篇1.VOL6.フレームページを作ってみよう・その６ <<
|
2006.7.19.
