working with html frames the good, the bad & the ugly
Post on 01-Jan-2016
218 Views
Preview:
TRANSCRIPT
Working with HTML Frames
The Good, The Bad & The Ugly
Frames Overview Method of dividing the browser
window into two or more sub-windows
Creating a framed page is like specifying a “blueprint” for a house
No content is specified in the HTML script that creates a framed page
Use frames only when absolutely needed
Frames – A Blessing & A Curse
Can detract from message conveyance
Can be distracting if not used correctly
Can be used to organize information
Can be used for consistency
Frame Basics No <body>…</body>
Container Individual framesets
can only be specified in rows or columns, but never both
Nested framesets are okay to use (allows us to use both rows and columns in the same page)
Frame Syntax - <frameset> Container that acts as a “blueprint”
in which all frames are specified Can be specified only in rows or
columns, but never both Can contain nested framesets Several attributes Syntax:<frameset>…</frameset>
Attribute: border
Specifies the frame border thickness between frames
Takes a value in pixels Syntax:<frameset border=“2”>
Found In: <frameset>Found In: <frameset>
Attribute: bordercolor
Specifies the border color Takes color names or hex values Support for this attribute is limited Syntax:<frameset bordercolor=“blue”>
Found In: <frameset>Found In: <frameset>
Attribute: cols
Specifies how the frameset is to be built – using columns
Establishes both number of columns and their sizes
Sizes can be specified in relative or absolute measurements
Syntax:<frameset cols=“85,*,85”>
Found In: <frameset>Found In: <frameset>
Attribute: rows
Specifies how the frameset is to be built – using rows
Establishes both number of rows and their sizes
Sizes can be specified in relative or absolute measurements
Syntax:<frameset rows=“30%,*”>
Found In: <frameset>Found In: <frameset>
Attribute: frameborder
Specifies whether or not a 3-D separator will be added between frames
IE and Navigator differ in frameborder values: IE takes “1” for yes and “0” for no Navigator takes “yes” or “no”
Syntax:<frameset frameborder=“0”
frameborder=“no”>
Found In: <frameset>Found In: <frameset>
Frame Syntax - <frame> Independent tag that defines a
single frame Helps define the content of a frame Found nested within <frameset>…</frameset>
Several attributes Syntax:<frame attribute1
attribute2 … >
Attributes: bordercolor & frameborder
Same purpose as the same attributes found in <frameset>…</frameset>
Same syntax:<frame bordercolor=“#FF0000”
frameborder=“1”frameborder=“yes”>
Found In: <frame>Found In: <frame>
Attribute: name
Gives a frame a name Required for referencing that
frame as a target in hypertext references
Syntax:<frame name=“topTitle”>
Found In: <frame>Found In: <frame>
Attribute: src
Specifies the source of the HTML file initially loaded into a given frame
Required Can take absolute or relative
pathnames Syntax:<frame src=“labs/lab1.html”>
Found In: <frame>Found In: <frame>
Attribute: src
Specifies the source of the HTML file initially loaded into a given frame
Required Can take absolute or relative
pathnames Syntax:<frame src=“labs/lab1.html”>
Found In: <frame>Found In: <frame>
Attribute: marginwidth
Specifies the amount of space between the left and right edges of a frame and the frame contents
Specified in pixels Syntax:<frame marginwidth=“10”>
Found In: <frame>Found In: <frame>
Attribute: marginheight
Specifies the amount of space between the top and bottom edges of a frame and the frame contents
Specified in pixels Syntax:<frame marginheight=“10”>
Found In: <frame>Found In: <frame>
Attribute: noresize
Specifies that the user will not be able to resize a frame
Needs only to be specified once in an individual frameset
Takes no values Syntax:<frame noresize>
Found In: <frame>Found In: <frame>
Attribute: scrolling
Specifies whether or not a scrollbar appears in a frame
Three possible values: yes no auto
Syntax:<frame scrolling=“auto”>
Found In: <frame>Found In: <frame>
Attribute: longdesc
Specifies a link to a document containing a text description of a frame
Used for non-visual browsers Syntax:<frame longdesc=“labs/lab1Desc.html”>
Found In: <frame>Found In: <frame>
Frame Syntax - <noframes> Container that defines content for
browsers that do no read frames Found after </frameset> tag No attributes Syntax:<noframes>Your browser does not support frames. Upgradeor die a slow, painful death!</noframes>
Nesting Framesets
<frameset rows=“20%,*”>
<frame name=“title”>
<frameset cols=“120,*”>
<frame name=“toc”> <frame name=“main”>
</frameset>
</frameset>
Targeting Frames Target frames using the standard
anchor tag - <a href …> Target is defined in content pages
only, not in <frameset>…</frameset>
Uses the target attribute target attribute identifies the
frame’s name
Targeting Frames Syntax:<a href=“mypage.html”
target=“main”>Open page in main frame!</a>
Targeting Frames Reserved target values:_blank_self_parent_top
Syntax:<a href=“mypage.html”
target=“_blank”>Open page in a new window!</a>
Using the <base> tag Allows you to specify a “default”
target for all links in a document Saves a lot of typing Found in the <head>…</head> Syntax:<head>
<base target=“main”></head>
Questions?
top related