Skip to main content
Practice

iframe Tag

The iframe tag is used to display another web page within the current web page.


iframe Tag Example
<iframe src="https://example.com" width="500" height="300"></iframe>

Using this code, the example.com web page will be displayed within a 500x300 pixel area of the current page.


Main Attributes of the iframe Tag​

src​

  • The src attribute specifies the URL of the web page to embed.

  • Code Example:

    iframe src Attribute Example
    <iframe src="https://example.com"></iframe>

width & height​

  • The width and height attributes specify the size of the iframe.

  • Code Example:

    iframe width & height Attributes Example
    <iframe src="https://example.com" width="400" height="250"></iframe>

frameborder​

  • The frameborder attribute specifies whether or not to display a border around the iframe. However, modern web browsers no longer recommend using this attribute, and it's advisable to use the CSS border property instead.

  • Code Example:

    iframe frameborder Attribute Example
    <!-- Deprecated Method -->
    <iframe src="https://example.com" frameborder="0"></iframe>

    <!-- Recommended Method -->
    <iframe src="https://example.com" style="border: none;"></iframe>

How to Use It?​

The iframe tag is commonly used to include videos (e.g., YouTube), maps (e.g., Google Maps), and external websites within a web page.

Want to learn more?

Join CodeFriends Plus membership or enroll in a course to start your journey.