HTML <object> Tag

The <object> tag embeds external resources in a page, such as, images, pdfs, audio, and video. For security reasons, browsers do not support plugins, applets, and flash animation anymore.

HTML Tag

Example

#

An <object> element.
It embeds an image of a Van Gogh painting.

Unable to display image.
<object data="/img/html/poppies.jpg" type="image/jpg">
   Unable to display image.
</object>

Tip: It is best not to use the <object> tag to render images. See below for alternatives.


Using <object>

The <object> element embeds external resources such as images, pdfs, audio, and video.

For security reasons browsers are limiting <object> access to certain items.

These limitations include plugins, applets, and flash animations.

If an <object> does not support the embedded resource, then the text inside will display.

Tip:  Browsers are limiting what an <object> tag can do.
As an alternative use these pure-play elements instead of <object>:

  • Use <img> to embed images,
  • Use <iframe> to embed HTML pages and PDF documents,
  • Use <audio> to embed audio files, and
  • Use <video> to embed videos.

More Examples

An <object> element that renders a PDF document.

PDF cannot be displayed.
<object data="/media/sample.pdf" type="application/pdf" 
        style="width:100%;height:350px;">
   PDF cannot be displayed.
</object>

Attributes for the <object> tag

This table lists the <object> tag attributes.

Attribute Value Description
data URL The path or URL of the resource to be embedded.
type media-type The media type of the embedded object.
id    identifier Defines a unique identifier for the object.
class    classnames Sets one or more CSS classes to be applied to the object.
style    CSS-styles Sets the style for the object.
data-*    value Defines additional data that can be used by JavaScript.
hidden    hidden Specifies whether the object is hidden.
height pixels Object height in pixels.
width pixels Object width in pixels.
name name Object name.
form form-id Id of the form the object belongs to.
usemap #mapname Id of the image map to be used with the embedded object.

For additional global attributes see our global attributes list.


Obsolete Attributes

Do not use the attributes listed below.  They are no longer valid on the object tag in HTML5.

Attribute Description Alternative
archive List of URLs for resource archives for the object. n/a
border Defines the border thickness around the object. CSS border
classid The URL of the object's implementation. n/a
codebase Base path for URLs specified by classid, data, or archive. base tag
codetype Defines content type of the data specified by classid. n/a
declare Makes this element a declaration only. Still needs instantiation. n/a
standby A message while object and data are loading. n/a
tabindex The position of the object in the tabbing sequence. n/a

Browser support

Here is when <object> support started for each browser:

Chrome
1.0 Sep 2008
Firefox
1.0 Sep 2002
IE/Edge
1.0 Aug 1995
Opera
1.0 Jan 2006
Safari
1.0 Jan 2003

You may also like

Guides