introductory tutorial 9 creating frames. xp new perspectives on blended html, xhtml, and css2...
DESCRIPTION
XP Objectives Identify the purpose of inline frames Create an inline frame Target an inline frame window Use the meta tag to create a slide show New Perspectives on Blended HTML, XHTML, and CSS3TRANSCRIPT
![Page 1: INTRODUCTORY Tutorial 9 Creating Frames. XP New Perspectives on Blended HTML, XHTML, and CSS2 Objectives Decide when to use frames for a Web site Learn](https://reader036.vdocument.in/reader036/viewer/2022062317/5a4d1b7c7f8b9ab0599b9539/html5/thumbnails/1.jpg)
INTRODUCTORY
Tutorial 9
Creating Frames
![Page 2: INTRODUCTORY Tutorial 9 Creating Frames. XP New Perspectives on Blended HTML, XHTML, and CSS2 Objectives Decide when to use frames for a Web site Learn](https://reader036.vdocument.in/reader036/viewer/2022062317/5a4d1b7c7f8b9ab0599b9539/html5/thumbnails/2.jpg)
XP
New Perspectives on Blended HTML, XHTML, and CSS 2
Objectives• Decide when to use frames for a Web site• Learn the components of framesets• Create a frameset document• Size frameset windows• Target individual frame windows
![Page 3: INTRODUCTORY Tutorial 9 Creating Frames. XP New Perspectives on Blended HTML, XHTML, and CSS2 Objectives Decide when to use frames for a Web site Learn](https://reader036.vdocument.in/reader036/viewer/2022062317/5a4d1b7c7f8b9ab0599b9539/html5/thumbnails/3.jpg)
XPObjectives• Identify the purpose of inline frames• Create an inline frame• Target an inline frame window• Use the meta tag to create a slide show
New Perspectives on Blended HTML, XHTML, and CSS 3
![Page 4: INTRODUCTORY Tutorial 9 Creating Frames. XP New Perspectives on Blended HTML, XHTML, and CSS2 Objectives Decide when to use frames for a Web site Learn](https://reader036.vdocument.in/reader036/viewer/2022062317/5a4d1b7c7f8b9ab0599b9539/html5/thumbnails/4.jpg)
XPUsing Frames on a Web Page• Frames divide a Web page into several windows
called frames– Each frame allows you to see a different Web page in the
same browser window• To create frames, you first need to create a frameset
document• Frames are similar to tables in that frames establish
rows and columns• The frameset document uses the <frameset>
</frameset> tags
New Perspectives on Blended HTML, XHTML, and CSS 4
![Page 5: INTRODUCTORY Tutorial 9 Creating Frames. XP New Perspectives on Blended HTML, XHTML, and CSS2 Objectives Decide when to use frames for a Web site Learn](https://reader036.vdocument.in/reader036/viewer/2022062317/5a4d1b7c7f8b9ab0599b9539/html5/thumbnails/5.jpg)
XPCreating a Row Frameset• To create a rows frameset, enter the following
code:<frameset rows="value1, value2, ..."></frameset>where value1 is the height of the first row, value2 is the height of the second row, and so forth. The values should be expressed as a percentage
• Optionally, use the (*) wildcard character as the last value or if the rows will be of equal height
New Perspectives on Blended HTML, XHTML, and CSS 5
![Page 6: INTRODUCTORY Tutorial 9 Creating Frames. XP New Perspectives on Blended HTML, XHTML, and CSS2 Objectives Decide when to use frames for a Web site Learn](https://reader036.vdocument.in/reader036/viewer/2022062317/5a4d1b7c7f8b9ab0599b9539/html5/thumbnails/6.jpg)
XPCreating Frames• To create frames, enter the following code:<frame src="filename.htm" name="framename" />where filename is the name of the file that will be displayed in the frame and framename is the name of the frame
New Perspectives on Blended HTML, XHTML, and CSS 6
![Page 7: INTRODUCTORY Tutorial 9 Creating Frames. XP New Perspectives on Blended HTML, XHTML, and CSS2 Objectives Decide when to use frames for a Web site Learn](https://reader036.vdocument.in/reader036/viewer/2022062317/5a4d1b7c7f8b9ab0599b9539/html5/thumbnails/7.jpg)
XPCreating Frames
New Perspectives on Blended HTML, XHTML, and CSS 7
![Page 8: INTRODUCTORY Tutorial 9 Creating Frames. XP New Perspectives on Blended HTML, XHTML, and CSS2 Objectives Decide when to use frames for a Web site Learn](https://reader036.vdocument.in/reader036/viewer/2022062317/5a4d1b7c7f8b9ab0599b9539/html5/thumbnails/8.jpg)
XPCreating a Column Frameset• To create a columns frameset, enter the following code:<frameset cols="value1, value2, etc."></frameset>where value1 is the width of the first column, and value2 is the width of the second column, and so forth. The values should be expressed as a percentage
• Optionally, use the (*) wildcard character as the last value or if the columns will be of equal width
New Perspectives on Blended HTML, XHTML, and CSS 8
![Page 9: INTRODUCTORY Tutorial 9 Creating Frames. XP New Perspectives on Blended HTML, XHTML, and CSS2 Objectives Decide when to use frames for a Web site Learn](https://reader036.vdocument.in/reader036/viewer/2022062317/5a4d1b7c7f8b9ab0599b9539/html5/thumbnails/9.jpg)
XPCreating a Column Frameset
New Perspectives on Blended HTML, XHTML, and CSS 9
![Page 10: INTRODUCTORY Tutorial 9 Creating Frames. XP New Perspectives on Blended HTML, XHTML, and CSS2 Objectives Decide when to use frames for a Web site Learn](https://reader036.vdocument.in/reader036/viewer/2022062317/5a4d1b7c7f8b9ab0599b9539/html5/thumbnails/10.jpg)
XPOpening a Document in a Specific Frame• By default, a link in a frameset document will
open in the same frame• Use the target attribute in the <a> tag– The target attribute should be set to the name of the
frame in which you wish to open the Web page
New Perspectives on Blended HTML, XHTML, and CSS 10
![Page 11: INTRODUCTORY Tutorial 9 Creating Frames. XP New Perspectives on Blended HTML, XHTML, and CSS2 Objectives Decide when to use frames for a Web site Learn](https://reader036.vdocument.in/reader036/viewer/2022062317/5a4d1b7c7f8b9ab0599b9539/html5/thumbnails/11.jpg)
XPUsing Magic Targets• Magic targets have special meanings in HTML– _top– _blank– _self
• The base tag automates the process of targeting links
New Perspectives on Blended HTML, XHTML, and CSS 11
![Page 12: INTRODUCTORY Tutorial 9 Creating Frames. XP New Perspectives on Blended HTML, XHTML, and CSS2 Objectives Decide when to use frames for a Web site Learn](https://reader036.vdocument.in/reader036/viewer/2022062317/5a4d1b7c7f8b9ab0599b9539/html5/thumbnails/12.jpg)
XPControlling Scrollbars and the Frame Size• To control the appearance of scrollbars and the
size of a frame, enter the following code:<frame src="filename.htm" scrolling="scroll_value"noresize="noresize" />where scroll_value is either auto, yes, or no, and noresize has a value of noresize to disable screen resizing.
New Perspectives on Blended HTML, XHTML, and CSS 12
![Page 13: INTRODUCTORY Tutorial 9 Creating Frames. XP New Perspectives on Blended HTML, XHTML, and CSS2 Objectives Decide when to use frames for a Web site Learn](https://reader036.vdocument.in/reader036/viewer/2022062317/5a4d1b7c7f8b9ab0599b9539/html5/thumbnails/13.jpg)
XPControlling Scrollbars and the Frame Size
New Perspectives on Blended HTML, XHTML, and CSS 13
![Page 14: INTRODUCTORY Tutorial 9 Creating Frames. XP New Perspectives on Blended HTML, XHTML, and CSS2 Objectives Decide when to use frames for a Web site Learn](https://reader036.vdocument.in/reader036/viewer/2022062317/5a4d1b7c7f8b9ab0599b9539/html5/thumbnails/14.jpg)
XPThe border Attribute• Eliminating borders creates a less cluttered look
to the screen– Seamless frames
New Perspectives on Blended HTML, XHTML, and CSS 14
![Page 15: INTRODUCTORY Tutorial 9 Creating Frames. XP New Perspectives on Blended HTML, XHTML, and CSS2 Objectives Decide when to use frames for a Web site Learn](https://reader036.vdocument.in/reader036/viewer/2022062317/5a4d1b7c7f8b9ab0599b9539/html5/thumbnails/15.jpg)
XPControlling the Frame Height and Width• To control the height and width of a frame, enter
the following code:<frame src="filename" marginheight="value" marginwidth="value2" />where value is the height of the frame in pixels and value2 is the width of the frame in pixels
New Perspectives on Blended HTML, XHTML, and CSS 15
![Page 16: INTRODUCTORY Tutorial 9 Creating Frames. XP New Perspectives on Blended HTML, XHTML, and CSS2 Objectives Decide when to use frames for a Web site Learn](https://reader036.vdocument.in/reader036/viewer/2022062317/5a4d1b7c7f8b9ab0599b9539/html5/thumbnails/16.jpg)
XPControlling the Frame Height and Width
New Perspectives on Blended HTML, XHTML, and CSS 16
![Page 17: INTRODUCTORY Tutorial 9 Creating Frames. XP New Perspectives on Blended HTML, XHTML, and CSS2 Objectives Decide when to use frames for a Web site Learn](https://reader036.vdocument.in/reader036/viewer/2022062317/5a4d1b7c7f8b9ab0599b9539/html5/thumbnails/17.jpg)
XPFrameset Attributes and Values
New Perspectives on Blended HTML, XHTML, and CSS 17
![Page 18: INTRODUCTORY Tutorial 9 Creating Frames. XP New Perspectives on Blended HTML, XHTML, and CSS2 Objectives Decide when to use frames for a Web site Learn](https://reader036.vdocument.in/reader036/viewer/2022062317/5a4d1b7c7f8b9ab0599b9539/html5/thumbnails/18.jpg)
XPFrameset Attributes and Values
New Perspectives on Blended HTML, XHTML, and CSS 18
![Page 19: INTRODUCTORY Tutorial 9 Creating Frames. XP New Perspectives on Blended HTML, XHTML, and CSS2 Objectives Decide when to use frames for a Web site Learn](https://reader036.vdocument.in/reader036/viewer/2022062317/5a4d1b7c7f8b9ab0599b9539/html5/thumbnails/19.jpg)
XPFrameset Attributes and Values
New Perspectives on Blended HTML, XHTML, and CSS 19
![Page 20: INTRODUCTORY Tutorial 9 Creating Frames. XP New Perspectives on Blended HTML, XHTML, and CSS2 Objectives Decide when to use frames for a Web site Learn](https://reader036.vdocument.in/reader036/viewer/2022062317/5a4d1b7c7f8b9ab0599b9539/html5/thumbnails/20.jpg)
XPCreating Inline Frames• Inline frames create a frame window within a document
without your having to create a frameset• To create an inline frame, enter the following code:<iframe src="filename" name="target_name"></iframe>where filename is the name of the file that will initially be displayed in the inline frames window and target_name is the name of the inline frames window
New Perspectives on Blended HTML, XHTML, and CSS 20
![Page 21: INTRODUCTORY Tutorial 9 Creating Frames. XP New Perspectives on Blended HTML, XHTML, and CSS2 Objectives Decide when to use frames for a Web site Learn](https://reader036.vdocument.in/reader036/viewer/2022062317/5a4d1b7c7f8b9ab0599b9539/html5/thumbnails/21.jpg)
XPCreating Inline Frames
New Perspectives on Blended HTML, XHTML, and CSS 21
![Page 22: INTRODUCTORY Tutorial 9 Creating Frames. XP New Perspectives on Blended HTML, XHTML, and CSS2 Objectives Decide when to use frames for a Web site Learn](https://reader036.vdocument.in/reader036/viewer/2022062317/5a4d1b7c7f8b9ab0599b9539/html5/thumbnails/22.jpg)
XPDocument Type Definitions
New Perspectives on Blended HTML, XHTML, and CSS 22
![Page 23: INTRODUCTORY Tutorial 9 Creating Frames. XP New Perspectives on Blended HTML, XHTML, and CSS2 Objectives Decide when to use frames for a Web site Learn](https://reader036.vdocument.in/reader036/viewer/2022062317/5a4d1b7c7f8b9ab0599b9539/html5/thumbnails/23.jpg)
XPUsing the meta Tag to Create a Slide Show• To create a slide show, enter the following code:<meta http-equiv="refresh" content="number_seconds; url=filename">where number_seconds is the number of seconds you want as the interval until the next file is displayed and filename is the name of the next file to be displayed in the slide show
New Perspectives on Blended HTML, XHTML, and CSS 23
![Page 24: INTRODUCTORY Tutorial 9 Creating Frames. XP New Perspectives on Blended HTML, XHTML, and CSS2 Objectives Decide when to use frames for a Web site Learn](https://reader036.vdocument.in/reader036/viewer/2022062317/5a4d1b7c7f8b9ab0599b9539/html5/thumbnails/24.jpg)
XPThe Future of Frames
New Perspectives on Blended HTML, XHTML, and CSS 24
![Page 25: INTRODUCTORY Tutorial 9 Creating Frames. XP New Perspectives on Blended HTML, XHTML, and CSS2 Objectives Decide when to use frames for a Web site Learn](https://reader036.vdocument.in/reader036/viewer/2022062317/5a4d1b7c7f8b9ab0599b9539/html5/thumbnails/25.jpg)
XPThe iframe Attributes
New Perspectives on Blended HTML, XHTML, and CSS 25