An iframe (imbedded frame) is a "window" or box that is imbedded in a webpage. The iframe tag uses the src attribute to designate the URL of a webpage that is to be displayed within the iframe. This article shows you how to create an iframe.
Welcome to Bucaro TecHelp!

Welcome to Bucaro TecHelp!
Maintain Your Computer and Use it More Effectively
to Design a Web Site and Make Money on the Web

About Bucaro TecHelp About BTH User Agreement User Agreement Privacy Policy Privacy Site Map Site Map Contact Bucaro TecHelp Contact Advertise on Bucaro TecHelp Advertise Here RSS News Feeds News Feeds

HTML5 Solutions: Essential Techniques for HTML5 Developers

Essential Techniques for HTML5 Developers

HTML5 brings the biggest changes to HTML in years. Web designers now have new techniques, from displaying video and audio natively in HTML, to creating realtime graphics on a web page without a plugin.

This book provides a collection of solutions to all of the most common HTML5 problems. Every solution contains sample code that is production-ready and can be applied to any project.

Click Here

HTML Iframe Basics

An iframe (imbedded frame) is a "window" or box that is imbedded in a webpage. The iframe tag uses the src attribute to designate the URL of a webpage that is to be displayed within the iframe.

The iframe element, created with the tags:
<iframe src="pageURL"></iframe> will create a default size window (about 300 pixels wide by 150 pixels high) with a border. If the src attribute referenced webpage displayed in the iframe is larger than the iframe, it will display scrollbars. The scrollbars will allow you to scroll to view the entire webpage.

The src attribute does not need to be a webpage, it can be an image, a PDF document, or any other document capable of being displayed on a webpage.

• iframes are often used to display advertising on a webpage, therefore some users will have iframes disabled in their browser. However, iframes are also used for many other purposes besides advertising so disabling them results in a cripled browser and most users will NOT have iframes disabled.

You can use the width and height attributes to set the dimmensions, in pixels, of the iframe. Alternatively, you can set width and height as percentages of the width and height of the iframe's containing element. Another commonly used attribute is frameborder which can be set to 0 to prevent display of a border, or set to 1 to always display a border.

Below is shown an iframe with the width, height, and frameborder attributes set.

<iframe width="200" height="150" frameborder="1" src="URL">
</iframe>

You can use the scrolling attribute to control the display of scrollbars. Set scrolling to "no" to prevent the display of scrollbars. In this case, if the displayed document is larger than the iframe, the user will not be able to scroll to view the entire document.

Set scrolling to "yes" to always display scrollbars. In this case, if the displayed document is smaller than the iframe, the scrollbars will be visible, but not functional. Set scrolling to "auto" to let the browser display scrollbars when necessary.

An iframe is an inline element, which means that when the browser lays out the webpage, the iframe will flow into place from left-to-right with the text, images and other inline elements. Similar to images. Like other inline elements, the bottom of the iframe will be alligned to the baseline by default. you can use the align attribute to align the iframe to the left,right,top,middle, or bottom within it's containing element.

RSS Feed RSS Feed



Web Design Sections

HTML5 for Masterminds

HTML5 for Masterminds

How to take advantage of HTML5 to create amazing websites and revolutionary applications

This book is not an introduction of HTML5 but instead a complete course that will teach you how to build compelling websites and amazing web applications from scratch. Every chapter explores basic concepts as well as complicated issues of HTML5, CSS3 and Javascript.

Concepts are supported by fully functional codes to guide beginners and experts through every single tag, style or function included in the specification.

Click here for more information.


[Site User Agreement] [Advertise on This site] [Search This Site] [Contact Form]
Copyright©2001-2011 Bucaro TecHelp 13771 N Fountain Hills Blvd Suite 114-248 Fountain Hills, AZ 85268