Sams Teach Yourself HTML and CSS in 24 Hours (7th Edition)

By nesting one frameset within another, you can create rather complex frame layouts. For example, the document shown in Figure 16.3 and listed in Listing 16.4 has a total of nine frames. A cols frameset is used to split each row of the rows frameset into three pieces. Before you get to thinking that I'm contradicting myself when it comes to the complexities of frames, please understand that the purpose of this example is to demonstrate how nested frames work, not to encourage a particular technique.

Listing 16.4. Creating the Page Shown in Figure 16.3 Using Three Horizontal <frameset>s Within a Vertical <frameset>

<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <title>The Entropy Almanac</title> </head> <frameset rows="43,*,43"> <frameset cols="43,*,43"> <frame src="/books/4/158/1/html/2/ctoplft.html" name="toplft" /> <frame src="/books/4/158/1/html/2/bordtop.html" name="top" /> <frame src="/books/4/158/1/html/2/ctoprgt.html" name="toprgt" /> </frameset> <frameset cols="43,*,43"> <frame src="/books/4/158/1/html/2/bordlft.html" name="left" /> <frame src="/books/4/158/1/html/2/main.html" name="main" /> <frame src="/books/4/158/1/html/2/bordrgt.html" name="right" /> </frameset> <frameset cols="43,*,43"> <frame src="/books/4/158/1/html/2/cbtmlft.html" name="btmlft" /> <frame src="/books/4/158/1/html/2/bordbtm.html" name="btm" /> <frame src="/books/4/158/1/html/2/cbtmrgt.html" name="btmrgt" /> </frameset> </frameset> </html>

Figure 16.3. This window contains nine frames, some of which are nothing more than blank pages with custom background tiles.

Figure 16.3 consists of nine separate web pages laid out in different frames, many of which consist solely of a background image for decorative purposes. The corners and side frames contain blank HTML documents, showing nothing more than specially designed background tiles. The top frame is a permanent title graphic, and the bottom frame is a navigation bar similar to the one shown in the previous example. The net effect is to surround the middle frame within a sort of "picture frame" border. Figure 16.4 shows thumbnails of all the background tiles and other graphics incorporated into the pages.

Figure 16.4. To create the border effect shown in Figure 16.3, I designed several custom background tiles and matching title graphics.

Категории