0% found this document useful (0 votes)
14 views

Frames: Jennifer Ventus

Jennifer Ventus ƒ Each HTML document is called a frame, and each frame is independent of the others. Frames allow for multiple ".html" documents to be displayed inside of one browser window at a time. ƒ ƒ ƒ The frameset element holds two or more frame elements. Each frame element holds a separate document. The frameset element states only HOW MANY columns or rows there will be in the frameset. The screen is divided into two columns. The left being 12

Uploaded by

irish x
Copyright
© Attribution Non-Commercial (BY-NC)
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
14 views

Frames: Jennifer Ventus

Jennifer Ventus ƒ Each HTML document is called a frame, and each frame is independent of the others. Frames allow for multiple ".html" documents to be displayed inside of one browser window at a time. ƒ ƒ ƒ The frameset element holds two or more frame elements. Each frame element holds a separate document. The frameset element states only HOW MANY columns or rows there will be in the frameset. The screen is divided into two columns. The left being 12

Uploaded by

irish x
Copyright
© Attribution Non-Commercial (BY-NC)
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 19

Jennifer Ventus

Frames
HTML Frames

 Each HTML document is called a frame, and


each frame is independent of the others.
 Frames allow for multiple ".html" documents
to be displayed inside of one browser window
at a time.
The HTML frameset Element

 The frameset element holds two or more


frame elements. Each frame element holds a
separate document.
 The frameset element states only HOW
MANY columns or rows there will be in the
frameset.
Basic Frame

<frameset cols="120,*">
</frameset>

The screen is divided into two


columns.  

The left being 120 pixels and the


right using the rest of the screen
(indicated by the *).
The HTML frame Element
 The <frame> tag defines one particular window (frame)
within a frameset.
  The src attribute specifies the initial document the frame
will contain.
Rows and Columns
 frameset cols="#%, *"

 Cols(columns) defines the width that each frame will have.

 frameset rows="#%, *“

 rows defines the height that each frame will have.


 If neither attribute is set, the frame takes up exactly the size
of the page.
 Frames are created left-to-right for columns and top-to-
bottom for rows. When both attributes are specified, views
are created left-to-right in the top row, left-to-right in the
second row, etc.
<html>
<head.<title>frames</title><
head>
<frameset rows="20%,*">
<frame src="banner.htm">
<frameset cols="25%,75%">
<frame src="menu.htm">
<frame src="main.htm">

</frameset>
</html>
Activity
 Create an html program that will output the
following:
Student Name: Mark Steven T. Ventus
ID Number: 123456 School Name
Section: ABC School Address

Exercises Filename: banner.htm


•Class Schedule
•UAAP
•etc.

Filename: menu.htm

Filename: index.htm
Linking the frames
<a href=“Exer1.htm">Exer1</a>

A hyperlink text that


leads to the page file

<a href="analysis.htm" target="main">Exer1</a>

If the link was in the Menu window of


our example, and we wanted it to load
a page in the main window, the HTML
code would be this
Menu.htm
<html>
<head><title>Menu</title></head>
<body>
<H1 align="center">MENU</h1>
<ul>
<li><a href="ncaa.htm" target="main">ncaa teams</a>
<li>testing
</ul>
</body>
</html>
index.htm
<html>
<head><title>frames</title><head>
<frameset rows="20%,*">
<frame src="banner.htm">
<frameset cols="25%,75%">
<frame src="menu.htm" name="menu">
<frame src="main.htm" name="main">
</frameset>
</html>
index.htm
<html>
<head><title>frames</title><head>
<frameset rows="20%,*">
<frame src="banner.htm">
<frameset cols="25%,75%">
<frame src="menu.htm" name="menu">
<frame src="main.htm" name="main">
</frameset>
</html>
Index.htm

<html>
<head><title>frames</title><head>
<frameset rows="20%,*">
<frame src="banner.htm" noresize scrolling=no>
<frameset cols="25%,75%" noresize>
<frame src="menu.htm" name="menu" noresize>
<frame src="main.htm" name="main" >
</frameset>
</html>
 <img src=“\sunga\subfolder\knights.jpg”>

 Sunga (folder name)


 Index.htm
 Ncaa.htm
 Table.htm
 Subfolder (images)
No borders!
<html>
<head><title>frames</title><head>
<frameset rows="20%,*">
<frame src="banner.htm" noresize scrolling=no>
<frameset cols="25%,75%" bgcolor=#006600 frameborder=0>
<frame src="menu.htm" name="menu" noresize scrolling=no>
<frame src="main.htm" name="main">
</frameset>
</html>
 Submission of Final Project
 OCTOBER 4, 2010 until 4PM ONLY
 Projects submitted after the scheduled date will be
considered LATE and will get a minus 20 (-20) on the
TOTAL AVERAGE OF THE SEATWORK and PROJECT.
 CD MUST HAVE a casing and a cover with FULLNAME
and SECTION on it.
 You may leave the CD at the Institute of Information
Technology (IIT) Office at the 3rd floor.
 2 to 3 students in a CD is allowed.
Reserved Target Attribute

 _blank loads the page into a new browser


window
 _self loads the page into the current window.
 _parent loads the page into the frame that is
superior to the frame the hyperlink is in.
 _top cancels all frames, loads in full browser
window.
 Nested frame sets 
 Framesets may be nested to any level.
 In the following example, the outer FRAMESET divides
the available space into three equal columns. The inner
FRAMESET then divides the second area into two rows
of unequal height.
 <FRAMESET cols="33%, 33%, 34%"> ...contents of
first frame... <FRAMESET rows="40%, 50%">
...contents of second frame, first row... ...contents of
second frame, second row... </FRAMESET>
...contents of third frame...</FRAMESET>
announcements

 Bring your own laptops next meeting with a


dreamweaver application installed.
 Final output of the “index.htm” will be
submitted next meeting. ALL FILES MUST
BE SAVED IN A CD. (with casing and names
listed at the cover)
 3-5 students in a CD with separate folders per
student
 Index.htm will be equivalent to QUIZ2.

You might also like