Iframe Example

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. Although attributes are available to control width, height, scrolling, and frameborder, we use the following CSS to control the appearance of our example:[1]

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

This is how the iframe displays:

Scrollbars will appear automatically if they are needed to display all the content in the iframe. If you don't want the iframe scrollbars to appear, you can use JavaScript to set the height of the iframe to show all is content.

Find out how to set up links to load new documents into the iframe.


  1. See W3 Schools for a gentle introduction to iframes and a list of attributes that can be used to control their appearance. ^