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

トップ > HTMLリファレンス > <iframe>

概要

形式
<iframe src="...">~</iframe>
サポート
LS / H5 / H4T / e3 / Ch1 / Fx1 / Sa1 / Op1 / N6
カテゴリ
フローコンテンツ
フレージングコンテンツ
エンベデッドコンテンツ
インタラクティブコンテンツ
パルパブルコンテンツ
親要素
エンベデッドコンテンツ を子要素に持てるもの
子要素
HTML Living Standard: 無し
HTML 5.2: 文脈の要求に従ったテキスト
タグの省略
開始タグ:必須 / 終了タグ:必須
属性
グローバル属性
src
srcdoc
name
sandbox
allowfullscreen
allowpaymentrequest
allowusermedia
width
height
referrerpolicy

説明

iframe は Inline FRAME の略です。src で指定した他のドキュメントを画面中にインラインで表示することができます。<iframe>~</iframe> の間には、<iframe> に対応していないブラウザのためのメッセージを記述します。

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

属性

【共通属性】
グローバル属性
詳細は グローバル属性 を参照してください。
【個別属性】
src=url
LS/H5/H4T/e3/Ch/Fx/Sa/Op/N6
フレームの中身に表示する文書のURLを指定します。
srcdoc=contents
LS/H5/Ch/Fx/Op
フレームに表示するコンテンツを src属性で別ファイルから指定するのではなく、直接 srcdoc属性で指定します。IE11, Safari 5.1 ではまだサポートされていません。
name=name
LS/H5/H4T/e3/Ch/Fx/Sa/Op/N6
フレームの名前を指定します。
【セキュリティ関連】
sandbox=sandbox
LS/H5/e10/Ch/Fx/Sa/Op
sandbox 属性を値なしで指定すると、iframeで表示されるコンテンツは別サイトのものと見なされ、フォームのサブミット、スクリプト、トップレベルコンテンツへの操作(window.top.location など)、Cookieなどへのアクセス、ポップアップ(<a target="_blank"> や window.open())、プラグインなどが無効化されます。sandbox="allow-xxx" のように値を指定すると、一部の機能を許可することができます。allow-xxx には、下記の値をスペースで区切って複数指定することが可能です。
allow-forms
LS/H5。フォームのサブミットを許可。
allow-modals
LS。モーダルダイアログの表示を許可。
allow-orientation-lock
LS。スクリーンの方向制御ロックを許可。
allow-pointer-lock
LS/H5。ポインターのロックを許可。
allow-popups
LS/H5。ポップアップを許可。
allow-popups-to-escape-sandbox
LS。サンドボックスが適用されないポップアップ表示を許可。
allow-presentation
LS/H5.2。Presentation APIの利用を許可。
allow-same-origin
LS/H5。Cookieなどへのアクセスを許可。
allow-scripts
LS/H5。ポップアップを除くスクリプトを許可。
allow-top-navigation
LS/H5。トップレベルコンテンツへの操作を許可。
allow-top-navigation-by-user-activation
LS。ユーザ操作による場合のみ、トップレベルコンテンツへの操作を許可。
allowfullscreen
LS/H5.1
フレームのコンテンツに requestFullscreen() による全画面フレームを許可するか否かを指定します。
allowpaymentrequest
LS/H5.2
フレームのコンテンツに PaymentRequest API を使用することを許可します。
https://www.w3.org/TR/payment-request/
allowusermedia
LS
フレームのコンテンツに getUserMedia() API を使用することを許可します。
referrerpolicy=policy
LS/H5.2/Ch46/Fx50
リソースにアクセスした際のリファラー(Referer)送信ポリシーを指定します。
no-referrer
送信しない。
no-referrer-when-downgrade
https から http にダウングレードする際には送信しない(デフォルト)。
same-origin
同一オリジン間移動の場合のみ送信する。
origin
オリジン情報(プロトコル+FQDN+ポート番号)のみを送信する。
strict-origin
オリジン情報(プロトコル+FQDN+ポート番号)のみを送信するが、ダウングレード時には送信しない。
origin-when-cross-origin
オリジンをまたがる場合は、オリジン情報のみを送信する。
strict-origin-when-cross-origin
オリジンをまたがる場合は、オリジン情報のみを送信するが、ダウングレード時には送信しない。
unsafe-url
常に送信する。
詳細は下記を参照してください。
 https://developer.mozilla.org/ja/docs/Web/HTTP/Headers/Referrer-Policy
【表示関連】
width=n
LS/H5/H4T/e3/Ch/Fx/Sa/Op/N6
フレームの横幅をピクセルまたはパーセンテージで指定します。
height=n
LS/H5/H4T/e3/Ch/Fx/Sa/Op/N6
フレームの高さをピクセルまたはパーセンテージで指定します。
align=align
[非推奨] H4T-4T/e3/Ch/Fx/Sa/Op/N6
フレームを表示する位置を指定します。
hspace=n
[非推奨] e3-10
フレームの周りの横方向の余白をピクセル単位で指定します。
vspace=n
[非推奨] e3-10
フレームの周りの縦方向の余白をピクセル単位で指定します。
marginheight=n
[非推奨] H4T-4T/e3/Ch/Fx/Sa/Op//N6
フレームの上下の余白をピクセル単位で指定します。
marginwidth=n
[非推奨] H4T-4T/e3/Ch/Fx/Sa/Op/N6
フレームの左右の余白をピクセル単位で指定します。
allowtransparency=bool
[非推奨] e5.5-9?
フレームを透明色にする場合は true を指定します。既定値は false です。この機能を有効にするには、フレーム内に表示するドキュメントの <body> の背景色(bgcolor)が "transparent" である必要があります。最近のブラウザでは、デフォルトで透明色になるようです。
seamless
[非推奨] H5d
フレームコンテンツがシームレスに表示されます。フレームの境界線は無く、CSS等も、あたかもフレーム内コンテンツがフレーム外のコンテンツの一部であるように適用されます。HTML5 の草案で検討されていましたが、最終勧告では破棄されました。
【ボーダー関連】
border=n
[非推奨] e4-?
フレームの枠線の太さをピクセル単位で指定します。
bordercolor=color
[非推奨] e4-?
フレームの枠線の色を指定します。
frameborder=frameborder
[非推奨] H4T/e3-?/N6
フレームの枠線を表示する場合は 1 を、表示しない場合は 0 を指定します。IEでは yesno も指定可能です。
【その他の属性】
datafld=datafld
[非推奨] e4-?
データバインド機能を用いる際の、データソースの列名を指定します。
datasrc=datasrc
[非推奨] e4-?
データバインド機能を用いる際の、データソースの ID を指定します。
framespacing=framespacing
[非推奨] e4-?
フレーム間の隙間をピクセル単位で指定します。
longdesc=longdesc
[非推奨] H4T-4T
このフレームに関する説明が title 属性で示せないくらいに長文の場合に、その説明ページのURLを指定します。
scrolling=scrolling
[非推奨] H4T/e3/Ch/Fx/Sa/Op/N6
スクロールバーの表示を制御します。HTML5 や HTML Living Standard ではサポートされていません。スタイルシートでスクロールバーを消すには、表示される側のコンテンツで body { overflow: hidden; } を指定する必要があります。
yes
常に表示
no
常に非表示
auto
自動(既定値)

使用例

HTML
<iframe src="a.htm" width=600 height=200></iframe>
表示

リンク


Copyright (C) 1996-2017 杜甫々
初版:1996年9月10日 最終更新:2017年12月31日
http://www.tohoho-web.com/html/iframe.htm