HTMLのiframe要素の説明です。iframe要素は、インラインフレーム(HTML文書内でさらに別の文書を表示させる領域)となる要素です。
目次
要素の記述例
iframe要素の記述例
<ul>
<li><a href="abbr.html" target="example">abbr.htmlを表示する</a></li>
<li><a href="address.html" target="example">address.htmlを表示する</a></li>
<li><a href="area.html" target="example">area.htmlを表示する</a></li>
</ul>
<iframe src="abbr.html" width="300" height="60" name="example">インラインフレーム表示が有効になっていません。</iframe>
閲覧中ブラウザーでの表示結果
要素の説明
- iframe要素は、インラインフレーム(HTML文書内でさらに別の文書を表示させる領域)となる要素です。
- iframe要素の内容は、インラインフレームに未対応の環境、もしくは表示しない設定になっている環境の場合のみ表示されます。
利用できる属性
属性名 | 属性の説明 |
---|---|
allowfullscreen | インラインフレームの内容を、Element.requestFullscreen()を使ってフルスクリーン表示できるかを定義する[link-html-ref-format_bool]です。 |
allowpaymentrequest | インラインフレームの内容で、Payment Request APIを利用して支払い要求の実行ができるかを定義する[link-html-ref-format_bool]です。 |
height | インラインフレームの高さを定義する属性です。定義する値はピクセル数で、負の整数は定義できません。 |
name | a要素やform要素のtarget属性で定義する表示先名を定義する属性です。1文字以上で先頭が「_」以外のアルファベットを設定する必要があります。 |
referrerpolicy | インラインフレームの内容を読み込む時にリファラを送信するかを定義する[link-html-ref-format_enum]です。 |
src | インラインフレーム内に表示させるHTML文書のURLを定義する属性です。srcdoc属性が同時に定義されている場合は、srcdoc属性のHTML文書が優先されて表示されます。 |
srcdoc | インラインフレーム内に表示させるHTML文書のソースコード全体を定義する属性です。src属性が同時に定義されている場合、srcdoc属性が優先されます。 |
sandbox | iframe要素によって埋め込まれたHTML文書に対しての制限を定義する属性です。 |
width | インラインフレームの幅を定義する属性です。定義する値はピクセル数で、負の整数は定義できません。 |
グローバル属性
HTMLのすべての要素はグローバル属性が利用できます。グローバル属性の一覧については「グローバル属性」を参照してください。
イベントハンドラ属性
iframe要素がサポートするイベントハンドラ属性については「イベントハンドラ属性」を参照してください。
ブラウザデフォルトCSS設定
Google Chromeの場合
iframe要素のブラウザデフォルトCSS
iframe {
border-width: 2px;
border-style: inset;
border-color: initial;
border-image: initial;
}
iframe:focus {
outline: none;
}