网页框架frameset、frame切分实例
我们在进行网页编程时候，经常使用到框架frameset、frame，实际应用中，大部分的站点后台也都是采用框架的形式实现。 网页框架就是把网页窗口切分成几个子框窗口，可以同时进行独立浏览和交互URL，所有框架标记都必须放到一个文档里，一般采用html格式（PHP等其它格式也可以），这个文档标示着框架的划分方式，也可无需<BODY> 标记。<frameset> 是用来划分框窗，每一框窗由一个<frame> 标记标。<frame>必须在 <frameset> 范围中使用，<frame> 标记所标示的框架是按由上而下由左至右的次序进行解析的，且<frameset>支持框架嵌套。
一、Frame框架基本概念
<frameset>——框架标记，用以宣告此HTML文件为框架模式，并约定本主体窗口的切分方式（第一层切分方式）。
<frame>——设定一个子框架窗口及其属性。
<frameset> 常用属性参数说明：
cols—— 垂直切分窗口，可用整数值（绝对宽度像素pix值）、百分比（窗口宽度百分比）或“ *”号进行，多个参数以逗号分割，其中“*”标示占用余下宽度空 间。
rows——设定方法同cols，只是切分方向为水平横向而已，为照顾浏览器的兼容以及程序可读性考虑，请勿在一个<frameset>标签中同时使用COLS和ROWS标记。
frameborder——框架边框，值为 0或 1 ， 0 表示无边框， 1 表示显示边框。
border——框架边框的厚度，以 pixels 为单位。
bordercolor—— 设定框架的边框颜。
framespacing—— 表示框架与框架间保留空白的距离。

<frame> 常用属性参数说明：
src——设定此框窗要显示的网页档案名称，每个框窗一定要对应一个网页档案。
name——设定框窗名称。
frameborder—— 设定框架边框，值为 0或 1 ， 0 表示无边框， 1 表示显示边框。
framespacing—— 表示框架与框架间的保留空白的距离。
bordercolor—— 设定框架的边框颜。
scrolling——设定是否要显示滚动条，YES，NO，AUTO三种。
noresize——是否允许用户改变框架大小，不设定或忽略则允许用户调整框架大小。
marginhight——表示框架高度边缘所保留的空间。
marginwidth——表示框架宽度边缘所保留的空间。
<noframes> 使用：
当用户浏览器不支持框架功能时，网页可能会显示空白。为了提醒用户，可使用 <noframes> 这个标记设定一些内容提醒浏览者或切换到其它可能的页面。
应用方法，在<frameset> 标记范围加入<noframes> 标记，以下是一个例子：
<noframes> 很抱歉，您的浏览器不支援框架。 </noframes>
<iframe>嵌入框架标记：
<iframe>标记作用是在一页网页中间插入一个框窗以显示另一个文件，同时具有NOframe的功能。如：
<iframe src="iframe.html" name="iname" align="middle" width="200" height="80" marginwidth="5" marginheight="5" frameborder="0" scrolling="Yes">
很抱歉，您的浏览器不支援框架。
</iframe>
二、framese、frame切分窗口实例
典型的框架分割示例代码：
左右框架分割示例：
<frameset cols="20%,*">
        <frame name="lnav" src="leftnav.html">
        <frame name="rmain" src="home.html">
</frameset>

上下框架分割示例：
<frameset rows="200,*">
        <frame name="top" src="top.html">
        <frame name="main" src="home.html">
</frameset>
T框架分割示例：
<frameset rows="200,*">
        <frame name="top" src="top.html">
        <frameset rows="20%,*">
                <frame name="lnav" src="leftnav.html"> 
                <frame name="rmain" src="home.html">
        </frameset>
</frameset>
iframe参数传递以上示例中的框架参数大家可以根据需要增加或修改，另外补充框架一般命名规则，上top,左lnav或left，右rmain或home或main，这样在使用上更加容易理解。

下面再介绍一种只使用IFRAME和Javascript实现的“框架”，当然这个框架就比较好玩点，自己爱怎么定制都可以，直接上源码：
<script language=javascript>
var bOpen=true;
function metsky_switch()
 {
        if (bOpen)
          {
                  document.all("frmleft").style.display="none";
                  bOpen=false;
         }
         else
         {       
                  document.all("frmleft").style.display="";               
                  bOpen=true;
         }
}
</script>

<table width="100%" height="100%" border=0 cellpadding=0 cellspacing=0>
  <tbody>
    <tr>
      <td align="middle" valign="center" nowrap id="frmleft"> 
                <iframe frameBorder=0 name="lnav" scrolling="auto" src="lnav.php" ></iframe>
      </td>
      <td bgcolor="#9999CC" onClick="metsky_switch()" title="打开/关闭左边导航栏" >   </td>
      <td > 
                <iframe frameBorder=0 id="rmain" name="rmain" scrolling="auto" src="main.php" ></iframe>
  </td>
    </tr>
  </tbody>
</table>

以上代码不使用上文的frameset标记，只是采用普通的JS和IFRAME，即可实现上文功能，对于侧边栏不是“太长”的一般推荐使用（否则自动出现的滚动条就有点丑*_*），编辑起来也比较方便。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。