<iframe></iframe>
| ブラウザ |
|
|---|---|
| 分類 | フロー・コンテンツ / フレージング・コンテンツ / エンベッディッド・コンテンツ / インタラクティブ・コンテンツ / パルパブル・コンテンツ |
| 利用場所 | エンベッディッド・コンテンツが置ける場所 |
| 内容 | テキスト 本文参照 |
iframe要素は、インラインフレーム（入れ子にされたブラウジング・コンテキスト）を表します。
<iframe src="example.html"></iframe>
| 属性 | 値 | ||
|---|---|---|---|
| 任意属性 | |||
src="" |
文書の指定 | URL | フレーム内に表示する文書のURL |
width="" |
フレームの幅 | 数値 | ピクセル数 |
height="" |
フレームの高さ | 数値 | ピクセル数 |
name="" |
フレームの名前 | アンダースコア（ _ ）で始まらない文字列 | 固有のフレーム名 |
srcdoc="" |
 フレームのコンテンツ |
HTMLコード | フレーム内に表示するコンテンツ |
sandbox="" |
セキュリティ上の制限 |
キーワード | 特定のキーワードを指定（詳細） |
allowfullscreen |
 フルスクリーンモードを許可 |
（allowfullscreen） |
値は省略可能 |
- src属性とsrcdoc属性が同時に指定された場合は、srcdoc属性が優先されることになります。
- allowfullscreen属性は、
requestFullscreen()の使用を許可する際に指定するそうです。（詳細未確認）
各属性の詳細については、下記のページを参考にしてください。
要素の内容に関して
HTML5では、iframe要素の内容は無意味なテキストとして扱われます。
しかし、iframe要素に対応していない古いブラウザでは、iframe要素の内容が代替コンテンツとして機能することになります。この場合、iframe要素の内容は次の条件を満たしている必要があります。
- 上記の条件については、仕様書で確認するようにしてください。（とりあえずフレージング・コンテンツは配置できるみたいですが、私には理解しきれませんでした…）
<iframe src="example.html">
ここに代替内容を記述します
</iframe>
- HTML5における変更点
-
- 要素の定義が微妙に変わりました。（インラインフレーム → 入れ子にされたブラウジング・コンテキスト）
- 要素内容の意味が変わりました。（代替コンテンツ → 無意味なテキスト）
- srcdoc属性、sandbox属性が追加されました。
- longdesc属性、scrolling属性、frameborder属性、marginwidth属性、marginheight属性、align属性が廃止されました。
- width属性とheight属性の値にパーセントの数値を指定できなくなりました。
- HTML 5.1における変更点
-
- allowfullscreen属性が追加されました。
使用例
<iframe src="iexample_a.html"></iframe>
- 表示例
- 表示サイズの指定がない場合は、上記のように300×150px程度で表示されます。（環境により異なるかもしれません）