An iframe (Inline Frame) is an HTML element that allows you to embed another webpage or document within the current page. Iframes are commonly used to embed videos, maps, and other types of external content without leaving the original webpage.
Iframes are useful for displaying external content seamlessly within your webpage. For instance, if you want to embed a YouTube video, Google Map, or another website, an iframe allows you to do so without requiring the user to navigate away. It’s also useful for embedding interactive content while keeping your own layout and design intact.
Here’s a basic example of an iframe that loads an external webpage:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Welcome To My Ifarme Page</title>
<style>
iframe {
border: 2px solid #3498db;
width: 100%;
height: 300px;
margin-top: 10px;
}
</style>
</head>
<body>
<iframe src="https://aitaurangabad.com/" title="Ait Website"></iframe>
</body>
</html>
Iframes can be used to embed videos, such as a YouTube video:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Welcome To My Ifarme Page</title>
<style>
iframe {
border: 2px solid #3498db;
width: 100%;
height: 300px;
margin-top: 10px;
}
</style>
</head>
<body>
<iframe width="560" height="315" src="youtube.com/watch?v=1CYmrhYCUqc"
title="YouTube video" allowfullscreen></iframe>
</body>
</html>