Categories
<iframe>
(short for inline frame) is an element used to embed another HTML document or webpage within the current document. It allows you to display external content, such as webpages, videos, maps, or other documents, within a designated area of the current webpage.
The <iframe>
element creates a rectangular region within the document where the embedded content is displayed. The source of the content is specified using the src
attribute, which can point to a URL or a local file.
Here's an example of using the <iframe>
element:
<iframe src="https://www.betekie.com" width="500" height="300"></iframe>
Output
In the example above, the <iframe> element is used to display the webpage at "https://www.betekie.com" within the iframe. The width and height attributes set the dimensions of the iframe.
The <iframe>
element also supports various attributes and options to control the appearance and behavior of the embedded content. Some commonly used attributes include:
src
: Specifies the source URL or local file path of the content to be displayed within the iframe.width
andheight
: Sets the width and height of the iframe region.frameborder
: Specifies whether to display a border around the iframe. Useframeborder="0"
to remove the border.allowfullscreen
: Enables the embedded content (such as videos) to be displayed in fullscreen mode.scrolling
: Controls whether scrollbars are displayed within the iframe. Usescrolling="auto"
to display scrollbars as needed.
Here's an example with additional attributes:
<iframe src="video.html" width="640" height="360" frameborder="0" allowfullscreen scrolling="auto"></iframe>
In this example, the src
attribute points to a local file named "video.html". The iframe has a width of 640 pixels and a height of 360 pixels, with no border, and scrollbars appearing as needed. The allowfullscreen
attribute allows the embedded video (if any) to be displayed in fullscreen mode.
The <iframe>
element provides a way to include external content within an HTML document while maintaining the separation between the embedded content and the surrounding webpage. It is commonly used for embedding videos, maps, social media widgets, advertisements, and other types of content from external sources.