embed element

If you don't know what an element is or how you must use it, I recommend you read the "HTML tags and attributes" tutorial that you can find in the HTML tutorials section.

Description

The embed element provides the means to insert external applications, typically those that require a plugin, into the document.

This element, introduced by Netscape 2 and then adopted by Internet Explorer 3 (back in the early '90s), has never before been part of an HTML standard. Nevertheless, it's been very well supported by all browsers in the market and frequently used in multiple websites, primarily, to insert Flash movies. Being so well supported, thanks basically to its longevity, the embed element has been the first choice for authors when they needed to embed Flash movies in their documents, despite the fact that it's been non-conformant all the time. This, added to the buggy and irregular implementations of the object element, has led HTML5 to bring it into the specification.

This element accepts any user defined attribute that doesn't match other attributes' names in the specification (namespace-less). The values of these attribute will be passed to the application the element embeds as parameters.

The use of any of the four legacy attributes (name, align, hspace and vspace) is forbidden, for producing inappropriate side-effects.

Examples

The most popular use for the embed element is to run flash movies inside a document. This example is reproducing exactly that situation. Beside the four standard attributes (src, type, width and height), we're providing two more (quality and wmode) that will be passed to the plugin as parameters, in order to command it to use high quality and transparent background in the movie.

The proper representation of this and the next example depends exclusively on the availability of the required plugins in the visitor's browser. This is a downside of embedded conent, as plugins are not always globaly supported.

<p>I can hardly see anything. Could you please turn on the light?</p>
<embed src="/assets/flash/light-bulb.swf" type="application/x-shockwave-flash" width="180" height="350" quality="high" wmode="transparent">

I can hardly see anything. Could you please turn on the light?

In the second example, we're going to insert a MIDI file. This is another typical type of resource that depends on a plugin. Remember that if you don't have the plugin installed in your browser you won't be able to access the resources inserted with embed.

Here, the width and height attributes have been ommited (as they are not needed) in order to let the plugin decide the appropriate dimension needed to display the controls. Additionally, a custom attribute has been set (autostart) to tell the plugin that it shouldn't start playing the file automatically.

<p>Here you have the MIDI version of "Air on the G string".</p>
<embed src="/assets/audio/Bach_Air_on_the_G_string.mid" type="audio/mid" autostart="false">

Here you have the MIDI version of "Air on the G string".

Attributes

Specific attributes

src

The URI of the resource that is to be embedded by this element and executed by the plugin.

This attribute is mandatory if the itemprop attribute is present in the embed element, as it's used to determine the value of the property.

Example

<embed src="suite-in-g-minor.mid"></embed>

type

The content type (or Internet media type) of the resource specified in the src attribute.

If both attributes, src and type are declared, the latter must match the content-type metadata provided by the resource in src.

Example

<embed src="suite-in-g-minor.mid" type="audio/mid"></embed>

width

A number of pixels indicating the width of the element. If this attribute is omitted a default value will be used.

Example

<embed src="commercial.swf" height="640" height="480"></embed>

height

A number of pixels indicating the height of the element. If this attribute is omitted a default value will be used.

Example

<embed src="menu.swf" height="150"></embed>

Global attributes

For information about global attributes refer to this list of global attributes in HTML5.

Events

Global events

For information about global events refer to this list of global events in HTML5.