You can use the <iframe> tag to create a browser within a browser and open documents from other sources.
This tag has increased importance because HTML5 doesn’t support the attributes of scrolling, frameborder, and marginheight, all of which were supported in previous versions of HTML.
One of the proposed specifications of the <iFrame> tag in HTML5 is the seamless attribute. This allows the outside source to be incorporated into the host document without borders or scrollbars. That means that the outside source will look as if it is part of the hosting document. Unfortunately, as of this writing, no browsers support the seamless attribute.
<!DOCTYPE html >
<html>
<head>
<title>Using the <iFrame> tag</title>
</head>
<body>
<strong>Using the iFrame tag</strong><hr>
<iframe src="http://www.google.com" width="600" height="250" seamless></iframe><br>
<iframe src="http://www.studyoverflow.org" width="600" height="250" seamless></iframe><br>
</body>
</html>
Notice that the seamless attribute is used in the above code, However, you still see the scrollbars and
borders. This means that the browser does not support the use of the seamless attribute.
Security can be a factor when bringing in any sort of content from an outside source. In HTML5, the
<iFrame> tag has a sandbox around it to help improve security. The sandbox’s attributes include the
following:
- allow-scripts: blocks or allows the execution of certain scripted content, including JavaScript.
- allow-forms: allows or blocks the submission of forms.
- allow-same-origin: forces the content of the outside document to originate from the same origin. Thus, a page cannot receive data from one origin and then write data to a different origin.
- Allow-top-navigation: allows or blocks navigation to top-level browsing content.
0 comments:
Post a Comment