html frames

13
HTML FRAMES HTML FRAMES Hafiz Muhammad Arslan Elahi 03325172005 BY

Upload: arslan-elahi

Post on 01-Jul-2015

213 views

Category:

Education


0 download

TRANSCRIPT

Page 1: Html frames

HTML FRAMESHTML FRAMES

Hafiz Muhammad Arslan Elahi03325172005

BY

Page 2: Html frames

Quiz

• Write a code for the following output– Table border “1”, background color “#c9c9c9”– Font color “blue”, cell spacing “”2px”

A B C D E F G

A B C D

A B C D E

A B C D E

A

A B C D E

Page 3: Html frames

Definition

• Frame is a container window that can display a web page

• Many web pages can display

• Break the page into different sections– Title– Navigational – Contents– Footer

Page 4: Html frames

Advantages

• Keep one part static and change other parts

• Multiple pages in the same browser

• Reduce load on the server– All pages not reloaded

Page 5: Html frames

Disadvantages

• Difficult to print the content of all frames as compared to a normal web page

• Most browsers do no allow to bookmark an individual frame page.

Page 6: Html frames

Tags

<frameset>

•Define the style and no. of frames

•Nested <frameset> also allowedAttributes Description

Rows Pixel, %age, * indicate remaining space

Cols As above

Border Width of border

Framespacing Space b/w the frames

Page 7: Html frames

Tags contd…

<frame>

•Nested in frameset tagAttributes Description

SRC Page displayed in the frame

Marginheight Space to be left at the top and left side of frame

Marginwidth Space to be left along the sides of frames

Name Name of frame

Noresize Frame un-sizeable

Scrolling Yes, no , autoVertical , horizontal scrollbars

Border Width of frames

Page 8: Html frames

Tags contd….

• Target Frame

Value Description

_parent Page loaded containing the current frame

_top Load into the whole browser window

_blank New browser window

_self Loaded in the same windowDefault target

Page 9: Html frames

Example

<frameset rows="20%, 70%,*">

<frame src="header.html" name="header">

<FRAMESET COLS="25%,*">

<FRAME SRC="NAVIGATION.HTML" NAME="NAVIGATION">

<frame src="content.html" name="content">

</FRAMESET>

<FRAME SRC="FOOTER.HTML" NAME="footer">

</frameset>

““frame.html”frame.html”

Page 10: Html frames

Example

<html>

<body>

<BR/><BR/><BR/>

<a href="content.html" target="content"> Content1</a>

<a href="content2.html" target="content"> Content2</a>

<a href="content3.html" target="content"> Content3</a>

<a href="content4.html" target="content"> Content4</a>

<a href="content5.html" target="content"> Content5</a>

</body>

</html>

““header.html”header.html”

Page 11: Html frames

Example

<html>

<body>

<a href="content.html" target="content"> Home</a><br/>

<a href="content2.html" target="content"> Services</a><br/>

<a href="content3.html" target="content"> Contact Us</a><br/>

<a href="content4.html" target="content"> About Us</a><br/>

<a href="content5.html" target="content"> FeedBack</a><br/>

</body>

</html>

““navigation.html”navigation.html”

Page 12: Html frames

Example

<html>

<body>

<center>

<a href="content.html" target="content"> Content1</a>

<a href="content2.html" target="content"> Content2</a>

<a href="content3.html" target="content"> Content3</a>

<a href="content4.html" target="content"> Content4</a>

<a href="content5.html" target="content"> Content5</a>

<p>&copy 2012,All Rights Reserved</p>

</center>

</body>

</html>

““footer.html”footer.html”

Page 13: Html frames

Output