创建框架结构的页面

《创建框架结构的页面》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、第9章创建框架结构的页面框架指的是页面的一种布局，这种布局和之前说的“表格布局”，还有之后章节将学习的“CSS+DIV”布局都是不同的。那么具体框架布局是怎样的呢？事实上，框架布局也许缺少了那么一些灵活性，但是它的特点是可以将浏览器分割成几部分。这是其他标签无法做到的，本章将介绍的便是这种技能。9.1创建窗口框架页面有这样的一种网页，导航栏放在左侧，右侧是页面主体。当浏览者点击左侧导航栏时，右侧的页面会刷新，但是，左侧导航栏部分依然保持不变。下图是一个常见的论坛导航页面。9.1.1创建窗口框架的和标签使用标签在HTML页面中设置框架。那么

2、，当一个浏览器被分成很多个框架的时候，这些框架放在一起，即称之为框架集。框架集的HTML标签为，也称之为框架结构标签。如果要在框架中放入内容，采用的方式是通过引用所放内容的路径，来加载对象。它的代码如下写法。//表明这是一个框架集//这是其中一个框架中的页面路径…9.1.2横向分割窗口窗口的分割只有横纵两个方向，没有斜方向的分割方法。横向分割窗口，使用“rows”属性。如代码所示。9.1.3纵向分

3、割窗口除去横向分割窗口，另一种形式则是纵向分割窗口。当纵向分割窗口的时候，使用的是cols属性。同样，用百分比或者像素都可以来表示框架横向的宽度。9.1.4框架的嵌套框架嵌套就是说如果同时混合使用横纵结构。即在分割的框架中再嵌套一个框架集。那么，写法上只要在标签中再放入标签就可以了。9.1.5将页面放入到窗口框架中将页面放置入窗口框架中，需要在每一个框架中通过路径的方式来添加页面。若一个框架集中包含3个框架，那意味着要准备3个页面分别放入相应的框架中。9.2花点心思修饰框架的细节设计页面没有太多复杂的技术，但是要设计出优秀的页面，关键在于对细节的

4、把握，也就是所谓的“细节出大师”。在设计这一领域中，是一条重要的准则：页面是给浏览互联网的用户提供的，必须要考虑页面给使用者的友好度。一个具有亲和力的页面会让浏览者对这个页面留下深刻的印象。9.2.1给无法处理框架的浏览器注释说明在框架设计的页面时候，有时，会遇到不能显示框架的浏览器。在这种情况下，可以使用标签加以注释。9.2.2固定框架的位置在标签的框架集中，虽然框架的位置是按照事先设定好的效果出现在浏览器中的，但是框架的边框并非是固定的，如果浏览者拖拽框架集的边框，框架的大小是可以随意改变的。若设计者希望固定框架的尺寸，可以使用

5、e>标签来定位边框的位置。9.2.3框架中设置滚动条窗口框架中有个细节，当页面中的内容超出框架的范围时，此时框架的底边会出现滚动条。这个滚动条也是可以设置的，通过scrolling属性可以实现这种控制。9.3修改框架边框的样式框架的边框样式也是可以修改的，通过一些简单的属性修饰，可以改变框架边框的表现形式。如边框的粗细、颜色，或者是边框的边距。使用这些特点，可以做出一些有意思的页面效果。9.3.1判定边框是否显示在有些情况下，灰色的边框会很麻烦，看上去像把页面剖解的支离破碎。使用“frameborder”属性可以决定是否显示边框。它的写法是：

6、rc="">9.3.2改变边框的表现效果border表示框架的边框。在这个属性上可以扩展出一些新的特性。如bordercolor，表示修改边框的颜色。通过修改border扩展的一些属性可以改变边框的表现效果。9.3.3边框的边距边距是指框架内页面内容和边框的距离。使用属性设置左右两边的边距，使用属性设置上下两边的边距。使用的方法如实例9-10页面展示的不同效果。9.4框架集中页面之间的链接本章的一开始，提到了如论坛形式的页面，以左边为导航栏，右边为页面的主体部分这样框架集下的布局页面。在本节中，将介绍如何使用超链接配合框架的特性，制

7、作出具有特色的页面。9.4.1在指定的框架中打开链接在一张原始的页面中，如下图所示的案例。通过这个案例，可以看到一个简单的页面导航是如何在同一个窗口中实现链接的。9.4.2框架内的锚点链接使用name属性还可以实现在框架内锚点链接。在框架集中设置页面路径的同时，指定锚点的位置。如下图所示，这是一张左右分割布局的页面。9.4.2框架内的锚点链接在这个页面中，设计者希望当点击左侧边框中文本“带有锚的链接”时，右侧边框中页面跳转到相应的文本位置。那么