Iframes - Basic Information

The following demonstrates an iframe with basic attribute settings:

<iframe id="ifrm" src="demo.html"></iframe>

The iframe's src attribute specifies the URL of the document to be displayed in the iframe.

Appearance of the iframe could be controlled using attributes such as frameborder, scrolling, width and height, but for better cross-browser consistency and HTML5 conformance, this example will use CSS instead:

iframe#ifrm {
    border:1px solid #ccc;
    width:80%; height:120px;
    }

This is how the iframe displays:

The document loaded into the iframe does not inherit styles such as font, colors or background from the containing document.[1] Styles to be applied to iframe content need to be included in that document in the usual ways, i.e., linked, embedded, etc.

More Information

W3 Schools has information on the iframe tag, listing all the attributes and their possible values, for both HTML4 and HTML5.

Back to top


  1. HTML5 introduces a seamless attribute that will allow for style inheritance, among other things, but browsers do not yet support it.^