HTML iframe

HTML <iframes> is used to place another web page content within current web page.Basically, it is a container that shows other web page information within that container.

General syntax of iframes:

Statement
   <iframe src="url" title="description"> </iframe>

Example

General Syntax

    <iframe src="..." title="result page"></iframe>

Source Code

      
        <iframe src="..." title="result page"></iframe>

Code Explanation

Note: Here, the URL specifies the address of the webpage while the title denotes the description of the web page.

Assigning Height And Width of An Iframe Using Iframe Property

General Syntax

    <iframe src=".." width="100%" height="300" style="border:1px solid black;"></iframe>

Source Code

      
        <iframe src="..." width="100%" height="300" style="border:1px solid black;"></iframe>

Code Explanation

Note: To provide height and width of iframe, use height and width property of iframe.

Providing Height And Width of An iframe Usign CSS

General Syntax

    <iframe src="..." style="height:200px;width:300px;" title="Iframe Example"></iframe>

Source Code

      
        <iframe src="" style="height:200px;width:300px;" title="Iframe Example"></iframe>

Code Explanation

Note:To provide height and width of iframe ,use height and width property of CSS.

Removing Iframe Border

General Syntax

    <iframe src="...." style="border:none;" title="Iframe Example"></iframe>

Source Code

      
        <iframe src="...." style="border:none;" title="Iframe Example"></iframe>

Code Explanation

Note:HTML Iframe border can be removed very easily by CSS style property of border.

Providing Border Of Ifarme

General Syntax

    <iframe src="..." style="border:2px solid red;" title="Iframe Example"></iframe>

Source Code

      
        <iframe src="..." style="border:2px solid red;" title="Iframe Example"></iframe>

Code Explanation

Note:The HTML iframe border can be provided by CSS style property of the border.

Online Test / Quiz

Question set 1

Our Tutorials

Html Tutorial HTML

Css Tutorial CSS

Bootstrap 5 Tutorial BOOTSTRAP 5

Bootstrap 4 Tutorial BOOTSTRAP 4

Materialize CSS Tutorial MATERIALIZE CSS