New・HTML実験室: 8.埋め込みタグを使う

webページそのものを埋め込むことが出来るのが、埋め込みタグです。webぺーじそのものを、画像のようにサイズを固定したフレーム（枠）の中に表示させます。これを、埋め込みタグと言います。

●<iframe src="アドレス" width= height= ></frame>
<iframe>というタグの中に、src=で参照するwebアドレスを入れます。width height のフレームのサイズは必須です。以下は、blogページを600×600の中に表示するものです。

フレームに入りきらないので、スクロールバーが表示されています。ページの要素だけをフレームに取り込むこともできます。その場合、オプションの設定を自動で書き出すために、webサイトが埋め込み用のタグを発生させてくれます。

●youtube動画を、フレームに取り込む

動画の下の共有をクリックし、埋め込むをクリックして、タグをコピーします。そのまま、メモ帳に張り付け、htmlで保存します。タグは長くなっているので、選択せずにコピーボタンでコピーします。

youtube用の様々なオプションが付いていますが、基本は<iframeタグで構成されています。

これをhtmlで保存して開くと、余計な要素がなく、動画だけが見られます。

標準のwidth heightを書き直して、サイズ調整して開くこともできます。＝の後ろに数字が来る場合は”は省略できます。文字の場合は”で囲う必要があります。小さくして、複数のyoutube動画を、並べて埋め込むこともできます。下は、実際に埋め込んだものです。

●swayのページを、フレームに取り込む

swayで作成したスライドショーもwebページなので、埋め込みタグが作れます。この場合も、アプリの埋め込みタグ作成から作りますが、タグの中のサイズは自分で直して使います。

これも、<iframeタグを使っています。このまま、メモ帳に張り付けて、htmlで保存すると、額に入ったスライドショーが見えます。blogのように、所有者が編集すると、額の中も変わります。

■ポイント　<iframeタグは、リンク先に飛ばずに、ページの中に枠を作って別ページを表示させるもので、埋め込むと言います。