Geekpedia Programming Tutorials






iFrame Basics

A short and easy tutorial on how to use iFrames.

On Tuesday, June 29th 2004 at 01:37 PM
By Justin Ruff (View Profile)
***--   (Rated 2.5 with 26 votes)
Contextual Ads
More HTML Resources
Advertisement

What Are iFrames? iFrames allow you to basically put a table on your site and within that table it will load another page. This is very useful if you are running an HTML site and you don't feel like adding an affiliate button to like 10 pages.

Now, how do we do these iFrames? It is very simple.

Look at this sample code :


<iframe src="page.html" width="250" height="250"></iframe>



To start an iframe, type

<iframe src=" "

Between the " " is where you will put the name of the page you want to load up in the frame. width and height can be expressed in pixels (ex. "250") or in percent (ex. "100%"). Now we end this with a > and then we add </iframe>

Now with this you can do many interesting things with your site, forum, or whatever you will use this for.
Digg Digg It!     Del.icio.us Del.icio.us     Reddit Reddit     StumbleUpon StumbleIt     Newsvine Newsvine     Furl Furl     BlinkList BlinkList

Rate Rate this tutorial
Comment Current Comments
by Joël Anthöni on Tuesday, October 19th 2004 at 02:53 AM

Sorry, but this "tutorial" (?) is incomplete..where did the frameborder attribute go? And the Name and Scrolling attribute? And it also should be:
<b>&lt;iframe.....&gt;Sorry, your browser doesnt supports IFrame's!&lt;/iframe&gt;</b>

I've rated this tutorial poor, im sure im correct with my vote. Please, learn to master HTML first before you attempt to write a tutorial ;)

by A thankful Newbie on Wednesday, June 1st 2005 at 10:51 AM

I am a relatively new user of html, but I found this tutorial to be clear and simple. It gave me the basic information that I needed even if it is not all inclusive, or maybe because it did not include too much information. Thank you!

by Nilesh on Thursday, September 8th 2005 at 09:04 AM

I think it`s good.I never us this in my website.Can u send me one example iframe of on email.plz..

by Lincoln on Sunday, April 9th 2006 at 02:50 PM

Justin:

I realize you wrote this a long time agi, however, the closing tag &lt;/iframe&gt; is being interpreted by my browser as HTML in your article and so it is not showing up on my screen.

I think it will show up if you substitute &lt;/iframe&gt; which will keep my browser from getting confused.

Lincoln

by Lincoln on Sunday, April 9th 2006 at 02:55 PM

Yikes, these comment boxes are being accepted as HTML by my browser so my message did not turn out correctly on the screen.

I meant to say, use ampersand l t semicolon forward slash iframe ampersand g t semicolon, but it was interpreted instead of displayted.

Lincoln again

by on Monday, April 10th 2006 at 11:03 AM

sorry!

by O_o on Monday, February 12th 2007 at 11:54 PM

I would of gone with this instead myself ^_^.

.iframe {
border: 0px;
height: 50px;
width: 96%;
padding: 2px;
overflow: auto;
text-align: justify;
position: relative;
left: 2%;
right: 2%;
color: #000000;
}


Comment Comment on this tutorial
Name: Email:
Message:
Comment Related Tutorials
There are no related tutorials.

Comment Related Source Code
There is no related source code.

Jobs HTML Job Search
My skills include:
Enter a City:

Select a State:


Advanced Search >>
Latest Tech Bargains

Advertisement

Free Magazine Subscriptions

Today's Pictures

Today's Video

Other Resources

Latest Download

Latest Icons