HTML iframe
HTML iframeは、Webページ内にWebページを表示するために使用されます。
HTML iframe構文
HTML<iframe>タグはインラインフレームを指定します。
インラインフレームは、現在のHTMLドキュメント内に別のドキュメントを埋め込むために使用されます。
構文
<iframe src="<i>url</i>" title="<em>説明</em>"></iframe>
<iframe>のtitle属性を常に含めることをおすすめします。これは、iframeの内容を読み上げるためにスクリーンリーダーによって使用されます。
Iframe - 高さと幅の設定
heightとwidthの属性を使用して、iframeのサイズを指定します。
高さと幅はデフォルトでピクセル単位で指定されます。
style属性を追加して、CSSのheightとwidthのプロパティを使用することもできます。
Iframe - 境界線を削除
デフォルトでは、iframeの周囲に境界線があります。
境界線を削除するには、style属性を追加し、CSSのborderプロパティを使用します。
CSSを使用すると、iframeの境界線のサイズ、スタイル、および色を変更することもできます。
iframe - リンクのターゲット
iframeは、リンクのターゲットフレームとして使用できます。
リンクのtarget属性は、iframeのname属性を参照する必要があります。
例
<iframe src="demo_iframe.htm" name="iframe_a" title="iframeの例"></iframe>
<p><a href="https://techis.jp" target="iframe_a">techis.jp</a></p>
この章のまとめ
・HTML<iframe>タグはインラインフレームを指定します
・src属性は、埋め込むページのURLを定義します
・常にtitle属性を含めます(スクリーンリーダーの場合)
・heightとwidthの属性は、iframeのサイズを指定します
・iframeの境界線はborder:none;で取り除きます
HTML iframeタグ
| タグ | 説明 |
|---|---|
| <iframe> | インラインフレームを定義します |
利用可能なすべてのHTMLタグの完全なリストについては、HTMLタグリファレンスを参照してください。
プログラミング学習を加速させる
プログラミングをプロの講師に教えてもらいませんか。