DEV Community


WDS14 - Webpage Inside Webpage

Omkar Ajnadkar
Masters in Computer Science at The University of Texas at Dallas
Originally published at on ・2 min read

In the last article we learned about:

  • Block level and Inline HTML elements
  • Important div and span elements In the today's article, we will study to display one webpage inside of other. So let's get started... Sometimes it is not sufficient just to provide the link to other website or put a screenshot of that website to give information. It is better to provide a  small box on the webpage where the other webpage is already opened and the user can simultaneously interact on both areas. Let's see how we can achieve this with help of HTML.

HTML iframe element

  • An iframe is used to display a web page within a web page.
  • Syntax:  <iframe src="URL"> </iframe>
  • Optional Attributes:

    • height : Set height of iframe
    • width :  Set width of iframe

Attribute values are by default (without any specified units) are in pixels but we can also use percentage based values.
  • By default, an iframe has a border around it. To remove it, we can use style attribute. Syntax: style="border:none;"
  • An iframe can be used as the target frame for a link.The target attribute of the link must be same as the name attribute of the iframe.

That's all for today. I actually want to start next part today, but it will be better if we complete that in one part tomorrow. In next part, we are going to see some important elements inside <head> tag, which we will not see on the webpage but will help a lot to search engines and browsers to understand your HTML. Till then _ #keepcoding. _

Discussion (0)