Survey
* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project
Download "*, *"> <frame
Document related concepts
no text concepts found
Transcript
Frames 2nd March Write the code for this using tables and using layers ….. Frames Frame layout and design Frame sets and nesting Using frames Target frames and windows Frames Web pages that do not use tables, layers or frames tend to be left-side heavy When a surfer clicks on a link, from a set of links, the browser displays the corresponding HTML file in a new web page, which may not have the same links, for further navigation – frames solve this Frames divide a browser window into regions, with each region having its own web page Frame Layout & Design A frame is a rectangle that has a width and height, a location in a browser window, and content A frame has width, height, location, and content A collection of frames is referred to as a frame set. It controls the layout of its frames A frameset and a frame are created using the <frameset> and <frame> tags (+ <noframes>) The <frameset> tag replaces tag replaces <body> tag Frame Layout & Design Useful tips: Keep the frameset simple Keep the frame’s content short Keep the frames organised – use a driver frame Frame Sets & Nesting A frame set width is defined by number of columns, cols A frame set height is defined by number of rows, rows Units of rows and cols can be pixels or percentage of browser window Frame Sets & Nesting Frame Sets & Nesting Frame Sets & Nesting XHTML does not have a limit on the depth of frame nesting However, one or two levels of nesting is all that is needed in practice Using Frames There are 4 XHTML tags that can be used: <frameset> - Encloses all other frame tags <frame> - Creates a frame in a frame set Attributes : name, src, noresize, scrolling, frameborder, marginwidth, marginheight, longdesc <iframe> - Creates an inline frame Attributes: rows, cols : rows, cols Attributes : name, src, width, height, align, scrolling, frameborder, longdesc, marginwidth, marginheight <noframes> - specifies alternative content for a browser Attributes: NO ATTRIBUTES Using Frames The <iframes> tag creates inline frames An inline frame is a frame that is embedded inside the content of a Web page No frame sets are required to create inline frames Unlike the <frame> tag, the <iframe> tag is used inside the <body> tag Using Frames <frameset rows="*, *" cols="50%, *"> <frame src="...." name="myFrame1" frameborder="0"/> <frame src="...." name="myFrame2" frameborder="0"/> <frame src="...." scrolling="no"/> <frame src="...." noresize marginwidth="0" marginheight="0"/> </frameset> Using Nested Frames <frameset cols="*, *"> <frameset rows="*, *"> <frame src="...."/> <frame src="...."/> </frameset> <frame src="...."/> </frameset> Target Frames & Windows Frames optimise web page layout and facilitate navigation Contents of some frames may never change and that of others may change frequently Frames offer convenience to web surfers Target frames receive content from other frames Target frames must be given names when they are created i.e. use name attribute of the <frame> tag The source frame can then refer to a target frame source by its name i.e. use target attribute Target Frames & Windows Target Frames & Windows Example.html <frameset cols=“160, *"> <frame src=“toc.html"/> <frame src=“initialContent.html“ name=“myTarget”/> </frameset> initialContent.html <h2> Click any link in the left frame…. </h2> toc.html <a href=http://www.neu.edu target=“myTarget”>NU programs</a><br/> <a href=http://www.mit.edu target=“myTarget”>MIT programs</a><br/> Conclusion Frames Frame layout and design Frame sets and nesting Using frames Target frames and windows Reference Steven M. Schafer (2005), HTML, CSS, JavaScript, Perl, and PHP Programmer's Reference, Hungry Minds Inc,U.S. Dan Cederholm (2005), Bulletproof Web Design: Improving Flexibility and Protecting Against Worst-Case Scenarios with XHTML and CSS, New Riders. Ibrahim Zeid (2004), Mastering the Internet, XHTML, and Javascript
