Web design creating cool web sites with html, xhtml, and css

Page 210

Chapter 8: Tables and Frames

183

That’s the basic concept of frame documents: Instead of a single page defining all the infor­ mation displayed to the visitor, the information is split into multiple pages, each given its own small piece of the window.

Specifying frame panes and sizes Now that you’re an expert with tables, it will come as no surprise that you have lots of options for frames, too, only a few of which are vitally important to understand. The most important tag to learn about is frameset. The frameset tag creates a frameset: a set of frames into which the Web page is split. In addition to being able to specify rows to split the Web page into horizontal panes, you can alternatively use cols to specify vertical panes. You can use three different values for these attributes: • A simple number to specify the desired size in screen pixels • An asterisk to specify the remaining space on the page • A percentage of page width by using the n% notation If you think you got all that, here’s a test for you: What does <frameset cols=”30%,19,*”> mean? The sequence cols=”30%,19,*” is interpreted as the first column being allocated 30 percent of the width of the window, the next column being allocated a slim 19 pixels, and the third column getting the remainder of the space on the window. You can create complex multipane Web pages, where each pane has autonomous behavior, by combining these attributes in creative ways: <html> <title>Lots of frames</title> <frameset cols=”80%,*”> <frameset rows=”30%,70%”> <frame src=”frames/top.html” /> <frame src=”frames/bottom.html” /> </frameset> <frameset rows=”33%,33%,*”> <frame src=”frames/advert1.html” /> <frame src=”frames/advert2.html” /> <frame src=”frames/advert3.html” /> </frameset>

</frameset>

</html>

In this case, what I’ve done is specify two columns of information. One column is 80 percent of the width of the screen; the latter gets the remaining width. That’s specified with the follow­ ing line: <frameset cols=”80%,*”>


Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.