<iframe> - インラインフレーム

■ 概要

項  目説  明
記述形式 <iframe src="HTMLファイル">~</iframe>
対応ブラウザー H5+ / e3+ / N6+ / Fx1+ / Op6+ / Ch1+ / Sa1+
種  類
(カテゴリー)
フロー・コンテンツフレージング・コンテンツエンベッディッド・コンテンツ
インタラクティブ・コンテンツパルパブル・コンテンツ
置ける場所 エンベッディッド・コンテンツが記入できる場所
内包要素
(コンテンツ・モデル)
テキスト
(コンテンツ・モデル: 直接指定

■ 解説

<iframe> は Inline FRAME の略です。 src属性で指定した他のドキュメントを画面中にインラインで表示することができます。

HTML4.01 では,Transitional や Frameset では採用されたものの,HTML4.01 Strict には採用されませんでしたが,HTML5 では復帰採用されています。

<iframe>~</iframe> の間には,テキストのみを入れることができ,HTML4.01 までは <iframe> に対応していないブラウザーのためのメッセージを記述することになっていました。 しかし,HTML5 では,src属性で指定したドキュメントが表示できない場合の対処法(フォールバック機能)が定義されていませんので注意が必要です。 つまり,HTML5 では iframe要素内に記述したテキストは,<iframe> に対応しないブラウザーにそう表示させるフォールバック・コンテンツとしては扱われませんので注意してください。

■ 属性

種  類名  称
【固有属性】 src, name, srcdoc *, sandbox *, width, height   
【グローバル属性】 accesskeyclasscontenteditable * dir
hidden *idlangspellcheck *style
tabindextitletranslate *
【ARIA role属性】
指定可能な値 (役割)
applicationdocumentimg,または,
presentation
【ARIA aria-* 属性】
指定可能なもの
ARIA グローバル状態とプロパティ
指定可能な役割の任意の状態とプロパティ   

■ CSSプロパティ

種  類名  称
【よく使うもの】 colorbackground-colorfontfont-sizefont-family

■ 使用例

HTMLソース
HTML
<body> ~ </body>
<iframe src="xx.html" height="300" width="300">
この部分は iframe 対応のブラウザーで見てください。
</iframe>

ちなみに,このページの上部の「HTML5 & CSS3 リファレンス」の部分は,<iframe> を用いています。

■ 備考