<embed>: 埋め込み外部コンテンツ要素

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨2015年7月⁩.

<embed> はHTML の要素で、外部のコンテンツを文書中の指定された場所に埋め込みます。コンテンツは外部アプリケーションや、対話型コンテンツの他の出所（ブラウザーのプラグインなど）によって提供されます。

試してみましょう

<embed  type="video/mp4"  src="/shared-assets/videos/flower.mp4"  width="250"  height="200" />

メモ:本文書は、HTML Living Standard の一部として定義された要素についてのみ記載します。以前の標準化されていない要素の実装については扱いません。

最近のほとんどのブラウザーは、ブラウザーのプラグインの対応を非推奨にして削除しているため、サイトを平均的なユーザーのブラウザーで操作できるようにしたいのであれば、<embed> に頼ることは賢明ではないということを意識しておいてください。

属性

この要素にはグローバル属性があります。

height: このリソースを表示する高さをCSS ピクセル値で示します。絶対的な値でなければなりません。パーセント値は使用できません。
src: 埋め込むリソースの URL を示します。
type: インスタンス化するプラグインを選択するために使用するMIME タイプ。
width: このリソースを表示する幅をCSS ピクセル値で示します。絶対的な値でなければなりません。パーセント値は使用できません。

使用上のメモ

object-position プロパティを使用して、要素のフレーム内の埋め込みオブジェクトの位置を調整することができ、object-fit プロパティを使用して、オブジェクトの寸法をフレーム内にどのように合わせるかを制御することができます。

例

html

<embed  type="video/quicktime"  src="movie.mov"  width="640"  height="480"  title="Title of my video" />

embed 要素にtitle 属性を使用してコンテンツにラベルを付けるようにしてください。そうすれば、読み上げソフトのような支援技術を使用して捜査している人々が内容を理解することができるようになります。題名がないと、埋め込みコンテンツが何であるかを特定することができません。このようにして文脈を見失うと、特にembed 要素が動画や音声のような対話的なコンテンツを含んでいたとに、混乱したり時間を浪費したりします。

技術的概要

コンテンツカテゴリー	フローコンテンツ、記述コンテンツ、埋め込みコンテンツ、対話型コンテンツ、知覚可能コンテンツ
許可されている内容	なし。これは空要素です。
タグの省略	開始タグは必須。終了タグを記述してはならない。
許可されている親要素	埋め込みコンテンツを受け入れるすべての要素。
暗黙の ARIA ロール	対応するロールなし
許可されている ARIA ロール	`application`,`document`,`img`,`none`,`presentation`
DOM インターフェイス	`HTMLEmbedElement`