HTML <iframe> Tag

An iframe is used to embed another document into a website, this can be a youtube vide, 360 virtual tour or even another webpage.

The iframe is used in Internet Explorer, Mozilla, Opera, Chrome and Safari which means it can be used safely on your website.

The use of iframes can be done in many ways and there is no real right or wrong way to do this as the best way depends on the final output required. Also for example if you use WordPress you use plugins to enalbe short codes.

In HTML5 we have new attributes that we can use such as sandbox, seamless and srdoc which we will show you how to use later.

Basic iframe coding:-

<iframe src=”http://www.chameleonwebservices.co.uk”></iframe>

iFrame Attributes

Attribute Value Description
Align left, right, top, middle, bottom Note this is no longer supported in HTML5.
Specifies hoe the alignment of an <iframe> will be plcaed on the page.
frameborder 10 Note this is not supported in HTML5. This specifies whether or not to display a border around the
<iframe>
height number pixels Specifies the physical height of an <iframe>
longdesc URL Note this is not supported in HTML5. Specifies that the page contains a long description of the
content of an <iframe>
marginheight pixels Note this is not supported in HTML5. Specifies the top and bottom margins for the content of an <iframe>
marginwidth number pixels Note this is not supported in HTML5. Specifies the left and right margins to be used around the <iframe>
name name Specifies the name of the <iframe>
sandbox “”, allow-forms, allow-same-origin, allow-scripts, allow-top-navigation Allows you to set extra restrictions for the content in the <iframe>
scrolling yes, no, auto Note this is not supported in HTML5. Specifies whether to display scrollbars in an <iframe>
seamless seamless Specifies that the <iframe> should merge in with the containing document. You do this using <iframe seamless>. This is only supported by Chrome and Safari.
src URL Specifies the URL of the document to embed in the <iframe>
srcdoc HTML_code Specifies the HTML content of the page to show in the <iframe>
width number of pixels Specifies the width of the <iframe>