ＨＰ作成講座、脱初心者編

ページの中のページ。<iframe>

一つの画面に複数のページを表示させる方法として、フレームを使う方法はすでに紹介しています。
そして、今度も一つの画面に複数のページを表示する方法です。
ページの中に表示するための枠があって、その枠内に別のページを表示させることが出来ます。
こんなふうに！

まず、このページはhihp20.htmlというＨＴＭＬファイルです。
そして、上の枠内に表示されているのは、child1.html（参照）という、本来別のページのファイルです。
このように、ページの中に四角い枠を用意して、そこに別のページを表示させる機能がインラインフレームです。
これが、このインラインフレームのソースです。

src=""	枠内に表示させるファイルのアドレスをここに指定します。これがないと、枠のみで中身は何も表示されません。
scrolling=""	枠内からはみ出して見えない部分をスクロールバーを出してスクロールできるようにする。スクロールバーを出すとき"yes" スクロールバーを出さないとき"no" 表示内容が枠からはみ出すときは、自動的に出す"auto" この属性を指定しなければ"auto"を指定したことになります。
width=""	枠の横幅を指定します。
height=""	枠の高さを指定します。
frameborder=""	枠線を表示するかどうかの指定です。表示するとき、"yes" 表示しないとき、"no" この属性を指定しなければ、"yes"を指定したことになります。
name=""	このインラインフレームに名前を付ける（半角英数字）。
align=""	この枠の配置を左寄せ（ align="left"）右寄せ（ align="right"）中央（ align="center"）に、指定する。

◆ align="left"とalign="right"を指定した場合について。
このインラインフレームのソースは
<iframe src="child1.html" align="left" width="300" height="100">
</iframe>
のようにalign="left"を指定しています。
そうすると、このように左寄せになると同時に後続の文字が右側に回り込みます。
そして、今度は align="right"を指定しました。
すると、インラインフレームは右寄せになって同時に後続の文字は左に回り込んでいます。
align="center"を指定した場合は、中央に配置され、１行だけその後に文字が続きます。
１行だけ文字が続きます。
改行するとこのように表示されます。後続の文字を含めて中央寄せになります。
右寄せや左寄せのような回り込みはありません。
◆ name=""を指定するのは、
主に、インラインフレーム内に表示するページを切り替えるときに使います。

枠内のページを変えるそして、このソースです。

インラインフレームのnameで、このインラインフレームの名前をkaeruと名付けています。
そして、リンクタグのtarget="kaeru"で、このインラインフレームを指定しています。
このように、インラインフレーム内のページを切り替えることが出来ます。 ◆ 最後にframeborder（枠線のありなし）についてです。
ここまで見てきたインラインフレームは、すべてframeborder="yes"。つまり、”枠線あり”になっています。
この属性を省略して書いていない場合は、自動的にframeborder="yes"と設定していることになります。
つまり、何も書かなければ”枠線あり”です。だから、枠線を消したい時のみ、この属性を指定すると良いかもしれません。
ちなみに枠線を消すとこんな感じです。

ソースは、

さらに、スクロールバーも消すと・・・

何だか・・・インラインフレームじゃないみたい・・・（*￣m￣)ぷっ！
しか～し、これでもインラインフレームです。ちなみにソースは、

ＰＣ－Ｐａｒｋトップ

心の話サイコロＴｏｗｎ！

広告		花万馬券	無料レンタルサーバーブログ blog