Learning HTML by yourself

C - IFrames

11/11/2011 18:11

IFrame elements is used in HTML 4 and new ones or HTML 5.  Below is a list of elements for 4.01

  • scr - the URL that will go into the IFrame.
  • height - the height of the window the file will go intol
  • width - the width of the same window.
  • name - the name of the window

These ones are new and only work with HTML5

  • scrdoc- the HTML for the source of the frame.  This is better then using the URL in the src attribute.
  • sandbox - a list of features that should be allowed or disallowed int he frame window.
  • seamless - tells the user that the iframe should be rendered like it is invisibly part of the document, you can't tell there is an iframe in it.


Below is the code that you use to build a simple iframe.  The normal tag markings go around it (<  >)

iframe src="URL address" width="200" height="200"




There are other attributes in 4.01 but no onlinger in HTML5.  See the list below and then look at the frames code below that to see where it's used:

  • align - where text will go around the iframe.
  • frameborder - for a border
  • scrolling - for a scroller if the text is too long
  • marginwidth and marginheight - for spacing around the iframe.
  • id="name of frame" - for targetting the file or link item.

Iframes are supported by a number of browsers:   the Android, chrome, Firefox, Internet Explorer 2+, Safari, Netscape 7+, Opera 3 and Safari Mobile.


Linking with IFrames

the following is the code for linking with the iframe, it has the width, heght and the target that you name the iframe.

If the document opened in the IFRAME does not have any targets set  then all it's links will open in the same iframe as the parent document.

You can use this feature to make links in one IFRAME change the contents of another IFRAME on the same page with links.


NOTE - you don't use the double quotes"

Notice below you can use VSPACE AND HSPACE.  VSPACE sets the vertical distance between the text and the inline frame.  HSPACE sets the horizontal space between the text and the frame.  These attributes are most commonly used in conjuntion with ALIGN to set the distance of wrapped text from the frame.  The margine width is the distance from the border to the text inside the frame.  These are all the attributes that you need.  Try all of these.  See below for the code with all the attributes there.  Try it out and instead of

You try it now.  In the next assignment/homework.  Get to work.  Put the Iframe in one of your works.