HTML CSS 講座 トップページへ

ホームページ作成 いまさらHTML,CSS講座

|  Home  |  ホームページ作成の知識  |  HTML 講座  |  HTML TABLE 講座  |  スタイルシート(CSS) 講座  |  携帯サイト 作成 講座  |
[HTMLテンプレートカテゴリ] [未分類カテゴリ]

いまさらHTML,CSS講座トップ > HTML4.01 講座インデックス > インラインフレーム IFrame
様々なブックマークサービスがご利用頂けます。

インラインフレーム IFrame

インラインフレームを定義します。
インラインフレームとは、ウィンドウを分割するのではなく、ページの行内に配置できるフレームで、そのフレーム内に別のページを表示するものです。
また、W3C が勧告する仕様においてインラインフレームは、HTML4.0では移行型DTD( Transitional )または、フレーム設定型DTD( Frameset ) で定義します。
ソース  ソース 基本
<iframe src="iframe_ex.htm" name="iframe_ex" width="300" height="30" frameborder="0" scrolling="yes" align="right" marginwidth="5" marginheight="5" title="インラインフレームサンプルページ">
インラインフレーム非対応環境への代替内容を記述します。
</iframe>○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○
表示  表 示
○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○
※ align属性の役割を分りやすくするために、親要素に width="300" を指定した表示になっています。
■ iframe要素
インラインフレームを定義します。
インラインフレーム未対応のブラウザの為に、開始タグと、終了タグの間に、インラインフレームの使用、代替内容または、内容となるファイルへのURIを記述しておきます。
■ src 属性
インラインフレームに表示させるファイルのURIを指定します。
■ name 属性
インラインフレームに名前を付けます。
a要素, area要素, base要素, form要素, link要素の target属性でリンク先に特定のインラインフレームを参照します。
■ width 属性 / height 属性
インラインフレームの、横幅 / 高さ を指定します。値は、数字(ピクセル表示)又は、パーセンテージ( % )値。数字で指定した場合の単位( px )は必要ありません。

■ frameborder属性
インラインフレームの境界線に関する指定をします。frameborder属性の指定が無い場合は、境界線が表示されます。
  • yes 又は 1 (境界線を表示、初期値)
  • no 又は 0 (境界線を非表示)
■ scrolling属性
インラインフレームの画面をスクロールする、しない、
ウィンドウサイズに応じてのスクロールバーの表示、非表示を指定します。
scrolling属性の指定が無い場合の初期値は、auto になります。
  • yes (画面をスクロールさせる)
  • no (画面をスクロールさせない)
  • auto 
    (ウィンドウサイズとページサイズによって、自動でスクロールのする、しないを指定します。初期値)
■ align属性 左右
align属性の値に、left right を指定する事で、テキストを回り込ませる位置を指定できます。
  • left (データの右側からテキストが回り込む)
  • right (データの左側からテキストが回り込む)
■ clear属性
br要素に clear属性を指定することで途中で回り込みを解除することができます。
  • none (通常の改行)
  • left (align="left" の回り込み解除。指定後のテキストは画像の下の行に表示される。)
  • right (align="right" の回り込み解除。指定後のテキストは画像の下の行に表示される。)
  • all (align属性値 left、rightに関係なく回り込み解除。指定後のテキストは画像の下の行に表示される。)
■ align属性 上下
align属性の値に、top middle bottom を指定する事で、テキストとインラインフレームの上下方向の揃え方を指定できます。また、指定しない場合の初期値は bottom に設定されています。
  • top (テキストとインラインフレームを上揃え。)
  • middle (テキストとインラインフレームを中央揃え。)
  • bottom (テキストとインラインフレームを下揃え。)
■ marginwidth 属性 / marginheight 属性
フレーム内に表示するページ( ここでは、iframe_ex.htm )の余白を指定を指定します。値は、ピクセル数値で記述しますが、単位はつけません。
marginwidth属性はフレーム内の左右の余白、marginheight属性はフレーム内の上下の余白を指定します。
■ title 属性
音声出力環境でのブラウジングは、フレームを使用したページの内容を把握するのが苦手なので、iframe要素に、title属性で、ページの内容を簡単に指定する事が推奨されています。

(C) いまさらHTML CSS講座 2002-2008 All right reserved