iframe要素

属性

属性	説明	HTML4	HTML5
src
name
width
height
allowfullscreen
allowtransparency	'true'ならば、背景色を透過させる [非標準]	×	×
frameborder	1ならば、フレームの境界にボーダーを描く	○	×
longdesc	フレームの長い説明のURI	○	×
marginheight	縦方向のマージンの幅 (ピクセル単位)	○	×
marginwidth	横方法のマージンの幅 (ピクセル単位)	○	×
scrolling	スクロールバーの表示 "auto" "yes" "no"	○	×
align	フレームの整列方法	○	×
sandbox		×	○
seamless		×	○
srcdoc		×	○

インラインフレーム内に表示させるリソースのURLを指定します。

コード	表示例
<iframe src=""></iframe> (空文字列)	<span class="warning-message">インラインフレーム対応のブラウザをお使いください。</span>
<iframe src="/"></iframe>	<span class="warning-message">インラインフレーム対応のブラウザをお使いください。</span>

リソースが置かれているサーバがレスポンスヘッダでX-Frame-Optionsを出力するとき、そのリソースはフレーム内に表示できません。The X-Frame-Options response header | MDN

※ブラウザによっては何も表示されません。

IE9のエラー画面

フレームの幅および高さを、ピクセルまたは割合で指定します。

コード	表示例
<iframe></iframe>
<iframe height="100px"></iframe>

背景色を透過させるかどうか指示します。

フレームの境界に線を描くかどうかを指示します。既定値は1で線が描かれ、0とすると線が表示されなくなります。なおこの属性はHTML4でのみサポートされるため、可能ならばCSSで指定します。

コード	表示例
<iframe></iframe>
<iframe frameborder="0"></iframe> frameborderで非表示
<iframe style="border: 1px black solid"> </iframe> CSSで表示
<iframe frameborder="0" style="border: 1px black solid"> </iframe> <!-- ※1 --> frameborderで非表示、CSSで表示

※1 CSSでborderを指定する場合、IE9より前では既定の境界線も表示されてしまうため、frameborder="0"でそれを明示的に非表示にする必要があります。

iframe非対応ブラウザ向けに、開始タグと終了タグの間に代替となる内容を記述します。

<iframe><!-- ここに代替方法を記す。 --></iframe>

しかし現行のブラウザはすべてiframeに対応するため、この記述の必要性は低いです。Browser compatibility - <iframe> - HTML | MDN

HTMLの情報サイトから、まとめて検索