iframes in HTML

iframes in HTML

14 May 2024
Advanced
989 Views
4 min read
Learn via Video Course & by Doing Hands-on Labs

HTML Free Course

iframes in HTML

With the help of iframes in HTML, the developer can inline frame with the HTML tag <iframe>. The <iframe> tag is not related to <frameset> tag (frameset tag is not supported in HTML5), instead, This tag can appear anywhere in your document. The <iframe> tag defines a rectangular section within the document in which the browser can show a separate document, including scrollbars and borders. An inline frame is used to connect another document within the current HTML document. If you want to learn how to use these features practically , or HTML Online Traning will help you

Example

<!DOCTYPE html>
<html>
   <head>
      <title> iframes in HTML</title>
   </head>
   <body>
      <p>Document goes here...</p>
      <iframe src = "/html/menu.htm" width = "550" height = "250">
         Sorry your browser does not support inline frames.
      </iframe>
     
   </body>
></html>

Output:

The <Iframe> Tag Attributes

Most of the attributes of the <iframe> tag, such as name, class, frameborder, id, longdesc, marginheight, marginwidth, name, scrolling, style, and title correlate with the attributes of the <frame> tag.

Note − The frameborder, marginwidth, longdesc, scrolling, marginheight attributes does not supported in HTML5..

1.) src

The src attribute is used to give the location of the file that should be loaded in the frame. For example, src = "/html/top_frame.htm" will load an HTML file available in html directory.

2.) name

The name attribute allows you to give a name to a frame. This tag is used to indicate that the document should be loaded into which frame. This attribute is important when you want to create links in one frame that link load pages into another frame, In which case the second frame needs a name for its identification as the target of the link.

3.) frameborder

The frameborder attribute specifies if the borders of that frame are shown or not, it disapproves the value given in the frame border attribute on the <frameset> tag if one is given, and this tag can take values either 1 (yes) or 0 (no).

4.) marginwidth

The marginwidth attribute allows you to specify the width of the space between the left and right sides of the frame's borders and the frame's content also. The value is given in pixels.

5.) marginheight

The marginheight attribute specifies the height of the space between the top and bottom of the frame's borders and contents. The value is given in pixels.

6.) height

The height attribute specifies the height of <iframe>.

7.) width

The width attribute specifies the width of <iframe>.

8.) scrolling

The scrolling attribute controls the appearance of the scrollbars that appear on the frame. This attribute takes values either "yes", "no" or "auto".

9.) longest

The longest attribute allows you to provide a link to another page that contains a long description of the contents of the frame.

Read More:- HTML Interview Questions and Answers 
 Summary

In this article, we learned about iframes in HTML, in simple words This tag can appear anywhere in your document. <iframe> tag defines a rectangular section within the document in which the browser can show a separate document, including scrollbars and borders, and apart from that we also learned about each attribute of HTML frames in detail. Click on HTML Certification in order to learn more.

Take our Html skill challenge to evaluate yourself!

In less than 5 minutes, with our skill challenge, you can identify your knowledge gaps and strengths in a given skill.

GET FREE CHALLENGE

Share Article

Live Classes Schedule

Our learn-by-building-project method enables you to build practical/coding experience that sticks. 95% of our learners say they have confidence and remember more when they learn by building real world projects.
Generative AI For Software Developers Jul 20 SAT, SUN
Filling Fast
08:30PM to 10:30PM (IST)
Get Details
Angular Certification Course Jul 20 SAT, SUN
Filling Fast
06:00PM to 08:00PM (IST)
Get Details
Azure Master Class Jul 20 SAT, SUN
Filling Fast
03:00PM to 05:00PM (IST)
Get Details
ASP.NET Core Certification Training Jul 28 SAT, SUN
Filling Fast
07:00AM to 09:00AM (IST)
Get Details
Software Architecture and Design Training Jul 28 SAT, SUN
Filling Fast
05:30PM to 07:30PM (IST)
Get Details
.NET Solution Architect Certification Training Jul 28 SAT, SUN
Filling Fast
05:30PM to 07:30PM (IST)
Get Details
Azure Developer Certification Training Jul 28 SAT, SUN
Filling Fast
10:00AM to 12:00PM (IST)
Get Details
Advanced Full-Stack .NET Developer Certification Training Jul 28 SAT, SUN
Filling Fast
07:00AM to 09:00AM (IST)
Get Details
Data Structures and Algorithms Training with C# Jul 28 SAT, SUN
Filling Fast
08:30PM to 10:30PM (IST)
Get Details
Angular Certification Course Aug 11 SAT, SUN
Filling Fast
09:30AM to 11:30AM (IST)
Get Details
ASP.NET Core Project Aug 24 SAT, SUN
Filling Fast
07:00AM to 09:00AM (IST)
Get Details

Can't find convenient schedule? Let us know

About Author
Sakshi Dhameja (Author and Mentor)

She is passionate about different technologies like JavaScript, React, HTML, CSS, Node.js etc. and likes to share knowledge with the developer community. She holds strong learning skills in keeping herself updated with the changing technologies in her area as well as other technologies like Core Java, Python and Cloud.

Self-paced Membership
  • 22+ Video Courses
  • 800+ Hands-On Labs
  • 400+ Quick Notes
  • 55+ Skill Tests
  • 45+ Interview Q&A Courses
  • 10+ Real-world Projects
  • Career Coaching Sessions
  • Email Support
Upto 60% OFF
Know More
Accept cookies & close this