<html> <head> <title>Inline Frame</title> </head> <body> Hello this is my website.<br /> <p align="center"> <iframe src="iframe-frame1.html" width="300" height="70"> If you can see this, your browser does not support inline frame. </iframe> </p> </body> </html>
The above code will be displayed by the browser this way …
About the code:
- The <iframe> tag tells the browser to insert an inline frame in the page. This should be closed with </iframe> tag.
- The src attribute indicates the URL of the document which would go in the frame.
- The width attribute indicates the width of the inline frame.
- The height attribute indicates the height of the inline frame.
- The content in between the <iframe> and </iframe> tags will be displayed if the browser does not support iframe tag.
Other Inline Frame Attributes
There are other attributes used to further define the inline frame. Those attributes will be discussed below. Open your text editor now and key in the next code.<html> <head> <title>Inline Frame</title> </head> <body> Hello this is my website.<br /> <a href="juan-dela-cruz-activity-1.html" target="anyname"> Activity 1</a> | <a href="juan-dela-cruz-activity-2.html" target="anyname"> Acitivity 2</a> <br /> <p align="center"> <iframe name="anyname" src="juan-dela-cruz-activity1.html" width="300" height="70"> If you can see this, your browser does not support inline frame. </iframe> </p> </body> </html>
The code above as displayed in the browser, see next illustration, note that the default webpage displayed in the iframe is the page linked on Activity 1. The default page is given by the src attribute of the iframe.
The browser display as the link Activity 2 is clicked on.
The browser display as the link Activity 1 is clicked on.
About the code:
<html> <head> <title>Inline Frame</title> </head> <body> Hello this is my website.<br /> <a href="juan-dela-cruz-activity-1.html" target="anyname"> Activity 1</a> | <a href="juan-dela-cruz-activity-2.html" target="anyname"> Acitivity 2</a> <br /> <p align="center"> <iframe name="anyname" src="juan-dela-cruz-activity1.html" width="300" height="70"> If you can see this, your browser does not support inline frame. </iframe> </p> </body> </html>
- The target attribute controls where the html document will be displayed when the user follows a link. Most of the time, clicking on a link simply loads a new document in the same window where the link was located. However, with target attribute, you can have the new document open in a new window or in another frame.
- The name attribute indicates the name of the iframe. This name can be used for targeting links. In our example, the name attribute value “anyname” is used as the value of the target attribute of the anchor tag to let the linked page be displayed in the iframe.
- The src attribute indicates the URL of the document which would go in the frame. The default page on the iframe is also set by the src attribute.
- Other attributes of <iframe> tag are:
- frameborder describes whether the frame should have a border around it;
- marginwidth controls the internal left/right margin for the frame;
- marginheight controls the internal top/bottom margin for the frame;
- scrolling describes whether the frame should have scroll bars, you may use the value “yes”, “no” or “auto”;
- align controls the alignment of the frame object to text around it;
- noresize is used so that the user will not be able to resize your frame;
- vspace controls the space above and below the frame; and
- hspace controls the space to the left and right of the frame
NOTE: For the browsers that do not recognize iframes, you have to place the text or object you want to show between the opening <iframe> tag and the closing </iframe> tag.
1 comments:
Thanks for posting this. I like your site. It's very informative.
Post a Comment