任务1-5　使用frameset实现页面布局

使用框架集不仅可以布局页面，同时还可以在一个页面内打开另一个页面。

需求：

按图1-15所示的样式进行页面布局，将整个显示区域划分成三个区域，即三个框架，其关系为整个页分为上下结构的框架集，下面结构又是由一个左右结构的框架集。上框架区域高度为50px，不可改变，剩余空间给下框架集，下框架集内包含左框架和右框架，左框架区域的宽度为199px，可以改变，剩余空间给右框架，左右框架之间留10px的间距。

分析：

由于右框架区域是主要显示区域，显示内容的数量不定，因此，这部分应带有滚动条，而其他框架不带滚动条。

实现：

为测试框架集，建立五个文件。

1.“框架集.aspx”文件，文件代码见清单1-10

清单1-10含有三个框架的框架集文件

框架集垂直分割用rows属性，水平分割用cols属性，如rows="50，*"和cols="199，*"。

框架一般是要给出name属性，特别是主显示区域的框架（本任务中为右框架）必须给出name属性，该属性是为超链接页面提供目标地址target。

框架的frameborder属性表示框架是否有边框，默认无边框。

框架的scrolling属性表示框架是否有滚动条，默认无滚动条。

框架的noresize属性表示框架是否固定区域的大小，默认不固定。

为了确保汉字的正常显示，框架文件的head标签内，添加下列＜meta＞标签的属性设置：＜meta http-equiv="Content-Type" content="text/html； charset=gb2312" /＞。

其他框架的其他属性就不再多介绍，读者可以查找相关资料。

2.建立“上框架.htm”文件

本任务对这部分要求很简单，只显示信息。代码见清单1-11。

清单1-11　显示在上框架的页面文件“上框架.htm”

3.建立“左框架.htm”文件

本任务对这部分只要求能建立两个超链接，实现在右框架中显示相应内容页面即可，主要部分见清单1-12。

清单1-12　左框架页面文件“左框架.htm”

4.建立“右框架1.htm”文件，右框架1.htm的主要内容见清单1-13

清单1-13　显示在右框架的页面文件“右框架1.htm”

这里使用的pre标签表示按文本的原来格式显示内容，如空格照原样显示。

5.建立“右框架2.htm”文件，右框架2.htm的主要内容见清单1-14

清单1-14　显示在右框架的页面文件“右框架2.htm”

说明

ul标签表示一个列表集合，li标签表示列表集合中的一个列表项，li标签只能在ul标签内。

pre标签表示按文本的原来格式显示内容（包括空格），但遇到标签仍不能做到照原样显示。解决方法是将小于号“＜”替换成“&lt；”，大于号“＞”替换成“&gt；”即可，最终显示结果如图1-16所示。

框架集文件不是页面，不能有body，更不能有form。这有时也带来了设计上的不便。取而代之的是iframe，它是VS 2013.NET中许可的标签，将在任务1-7中介绍。

如果需要使页面两侧分别保留50px空隙，可以利用frameset嵌套，在原frameset基础上外套一个更大的frameset，见清单1-15。

清单1-15　用框架预留左右两侧间距