html frame跳转实例,HTML Frameset 例子代码

这一篇，介绍一个Frameset做的简单到不能再简单的框架。

好先来看看这个框架的页面构成，由于是纯手工做的测试程序，所以只是在Notepa++中做了一下代码，很粗略。但是还是包含了Frameset中的大致内容的。好，言归正传，首先看一下文件构成。

1.Frame.html包含框架的结构

2.link.html包含框架左侧菜单栏

3.firstPage.html包含框架主页面的一行文字(个人比较懒，没有好好做)

4.secondPage.html和上面3类似，用于测试。

下面是一个截图(不清晰，第一次搞这个东西)

先看一下Frame.htm中的代码：

是不是感觉很简单？主要就是一个Frameset元素，然后设置了cols="159px,*"这个属性。这个属性的作用就是将页面分割成159px和其他两块区域。如上图所示。

然后是frame标记，上面的cols属性有几个值下面的子元素相应的也应该有几个。然后是一些常见的属性。包括边框的宽度，是否出现滚动条，边框颜色，是否允许用户改变大小。源文件是哪个等等一些属性。

然后第二个的源文件指向firstPage作为测试用。

接下来是link.html:

#PARENT{

width:180px;

}

*#PARENT{

width:100%;

}

• 我的网站
  • 第一个页面
  • 第二个页面
• 我的帐务

  支付

管理 网上支付 登记汇款 在线招领 历史帐务 网站管理

• 登录

角色管理

用户管理

这个其实就偷懒了，是从网上找的一个DIV+CSS+JS做的一个下拉菜单，有兴趣的可以自己看一下，我感觉自己能用起来，知道怎么改就OK了。

下面是两个测试页面，由于这连个测试页面稍微懂点HTML的都能写出来，这里就只贴出页面1的代码：

第一个页面

第一个页面

估计高手看到这都要吐了，一定说很垃圾，不过只是记录下自己做的小东西。呵呵，见谅了啊。