HTML Iframes

  • HTML Iframes are used for putting the another webpage into a html page.
  • <iframe> tag works like the <img> tag, only instead of putting a picture on the page, it puts another web page.
  • Unlike the <frameset> tag, <iframe> tag is used in the body part of html document.

  • Here is the basic syntax of <iframe> tag :

    <iframe src="URL"></iframe>

  • Here is a simple example of <iframe> tag:

    <!DOCTYPE html >
    <html>
    <body>
    <iframe src="HTML-Backgrounds.html">
    Sorry your browser does not support iframe tag.
    </iframe>
    </body>
    </html>


  • To see live output : Visit Try Yourself Editor

    Output





  • In the above program <iframe src="HTML-Backgrounds.html"> will display the contents of the file HTML-Backgrounds.html in the inline frame.
  • Iframe: height and width


    • You can use the height and width attributes of <iframe> tag to specify the size of inline frame.
    • The height and width of inline frame are specified in pixels but it can also specify in precent.
    • Here we are going to discuss an example which will show the use of height and width attributes of <iframe> tag:

      <!DOCTYPE html >
      <html>
      <body>
      <iframe src="HTML-Backgrounds.html" width=450 height=450>
      Sorry your browser does not support iframe tag.
      </iframe>
      </body>
      </html>


    To see live output : Visit Try Yourself Editor

    Output





  • In the above program <iframe src="HTML-Backgrounds.html" width=450 height=450> will display the contents of the file HTML-Backgrounds.html in the inline frame and the dimensions of inline frame will be 450*450.