What is an iframe?

Sera Tajima
2 min readApr 26, 2018

--

An iframe is an inline html element that allows nested browsing. iframes are like little windows within your page that allow users to see another page. For example, iframes are commonly used to embed Google Maps, which you might see on a Contact or About page.

While you can include as many <iframe> elements as you’d like within a page, each iframe is a complete environment in itself and can therefore cause substantial increases in the memory required. For this reason, it’s best to limit the amount of iframes or at least consider the performance issues multiple iframes may cause.

The content of an iframe can be on any html page on the same server or hosted externally. iframe elements embed the document with the <body> of a page. To create the iframe within the file, you’d use the <iframe> element. The main attributes used for an iframe are src, height, width and seamless.

src

The src attribute is the URL of the page you want to embed in the iframe.

height

The height attribute is the height of the iframe in pixels. In html5, percentage values are no longer accepted.

width

The width attribute is the width of the iframe in pixels. Again, this is obsolete since html5.

seamless

Seamless is a new attribute from html 5 that can be applied to an iframe if scrollbars are not desired. This attribute does not need a value but can be given a value of seamless. Note that older browsers will not support this attribute.

For a full list of current and deprecated attributes, see Mozilla.org.

Example

<iframe id=”Example1"

width=”200"

height =”150"

src=”https://www.maps.google.com/union_square&amp;output=embed” seamless>

</iframe>

--

--