In this tutorial, you will learn HTML iframe
An HTML iframe (short for inline frame) is used to embed another HTML document within the current HTML document. This allows you to display content from another website or page within your own website or page.
Here is an example of how to use an iframe in HTML:
<iframe src="https://www.example.com" width="800" height="600"></iframe>
- The “src” attribute is used to specify the URL of the page or website that you want to embed.
- The “width” and “height” attributes are used to specify the size of the iframe. You can specify the size in pixels or as a percentage of the available space.
- You can also specify the name of the iframe using the “name” attribute, which can be used to reference the iframe from other parts of the page or from JavaScript.
- By default, the iframe will have a border around it. You can remove the border by adding the CSS style “border: none;”.
- You can also add an alternative text to be displayed if the iframe cannot be loaded using the “alt” attribute.
Here’s an example of how you can use the iframe tag with some of the attributes mentioned above:
<iframe src="https://www.example.com" width="800" height="600" name="myframe" style="border: none;"></iframe>
In this example the iframe is 800px wide and 600px tall, it has no border, and it’s named “myframe”.
Note that some websites may not allow their content to be embedded in an iframe using a “same-origin policy” that is put in place to prevent a malicious website from embedding its content without permission.
You can also use iframes to embed multimedia content like videos, using the “src” attribute to specify the video source, width, and height, and in some cases additional attributes like “controls” and “autoplay”.
<iframe src="https://www.example.com/video.mp4" width="800" height="600" controls autoplay></iframe>
In this example the video is 800px wide and 600px tall, it has the controls to play, pause, and volume, and it will start playing automatically as soon as the page loads.
In summary, HTML iframes are used to embed another HTML document within the current HTML document, allowing you to display content from another website or page within your own website or page. You can use the “src”, “width”, “height”, “name”, “style” and “alt” attributes to customize the iframe, and also use them to embed multimedia content like videos.