下面通过一个后台管理的部分设计来说明窗口分帧

frameset.html代码

 <!--
 <frameset>标签（常用来做后台管理界面）
     属性：rows（行）、cols（列）、可以使用固定值，百分比和*三种
     border;确定边框的宽度
     frameborder：确定是否有边框

 <frame>标签
     属性：src
         name
         scroling：是否有滚动条
         noresize：是否可以调整尺寸

 <a href="">的属性
     四个内置属性：_blank、_parent、_self、_top

 <noframes>标签
 作用：使用它，如果浏览器中不带分帧窗口，显示这里面的内容

 <iframe>标签
 属性和frameset的属性相同

 注意：分帧不能和body标签及内容体共存
 -->
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
 <title>HTML窗口分帧</title>
 </head>
     <frameset rows="18%,*" frameborder="yes">
             <frame src="header.html" name="top" noresize="noresize"/>
         <frameset cols="15%,*">
             <frame src="menu1.html" name="left" noresize="noresize"/>
             <frame src="main.html" name="rigth"/>
         </frameset>
     </frameset>
     <noframes>                                                    你使用的是不带分帧的浏览器，请使用有分帧的浏览器，后转向不使用分帧的页面访问</noframes>
 </html>

header.html代码

 <center><h3>后台管理界面头部</h3></center>
 <a href="menu1.html" target="left">第一项</a>||
 <a href="menu2.html" target="left">第二项</a>||
 <a href="menu3.html" target="left">第三项</a>||
 <a href="menu4.html" target="left">第四项</a>

menu1.html代码

 <center><h4>菜单部分一</h4></center>
 <a href="">第一页</a><br />
 <a href="">第二页</a><br />
 <a href="">第三页</a><br />
 <a href="">第四页</a><br />
 <a href="">第五页</a><br />
 <a href="">第六页</a><br />

menu2.html代码

 <center><h4>菜单部分二</h4></center>
 <a href="">第一页</a><br />
 <a href="">第二页</a><br />
 <a href="">第三页</a><br />
 <a href="">第四页</a><br />
 <a href="">第五页</a><br />
 <a href="">第六页</a><br />

menu3.html代码

 <center><h4>菜单部分三</h4></center>
 <a href="">第一页</a><br />
 <a href="">第二页</a><br />
 <a href="">第三页</a><br />
 <a href="">第四页</a><br />
 <a href="">第五页</a><br />
 <a href="">第六页</a><br />

menu4.html代码

 <center><h4>菜单部分四</h4></center>
 <a href="">第一页</a><br />
 <a href="">第二页</a><br />
 <a href="">第三页</a><br />
 <a href="">第四页</a><br />
 <a href="">第五页</a><br />
 <a href="">第六页</a><br />

main.html代码

 <center><h4>主体内容部分</h4></center>

以上的代码是后台制作用到分帧的代码示例

下面是前台用到分帧的代码示例

 <!--
 iframe可以和body体一起使用
 -->
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
 <title>iframe标签</title>
 </head>
 <body>
     ##############<br />
     ##############<br />
     ##############<br />
     ##############<br />
     <a href="../1/1.html" target="ie">1.html</a><br />
     <a href="../2/2.html" target="ie">2.html</a><br />
     <a href="../3/3.html" target="ie">3.html</a><br />
     <iframe src="../1/1.html" name="ie"></iframe><br />
     @@@@@@@@@@@@@@<br />
     @@@@@@@@@@@@@@<br />
     @@@@@@@@@@@@@@<br />
     @@@@@@@@@@@@@@<br />
     @@@@@@@@@@@@@@<br />
 </body>
 </html>

在后台中用分帧一般用<frameset>标签，前台的一般用<iframe>

HTML的窗口分帧的更多相关文章

  1. HTML高级标签（2）————窗体分帧（2）————后台管理页面

    使用frameset进行窗体分帧.构建简易的后台页面.这篇博客就作为一个简易后台管理页面的实战演练. watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvd3px ...

  2. HTTP2.0的二进制分帧

    1.帧的类型: 在二进制分帧的结构中,头部有8个字节(64Bit),其中有一个字节(8Bit)来标志帧的类型: HTTP2.0规定了如下帧类型: DATA: 用于传输HTTP消息体 HEADERS:用 ...

  3. WPF中利用后台代码实现窗口分栏动态改变

    在WPF中实现窗口分栏并能够通过鼠标改变大小已经非常容易,例如将一个GRID分成竖排三栏显示,就可以将GRID先分成5列,其中两个固定列放GridSplitter. <Grid Backgrou ...

  4. PHP分帧后台模板页面css样式,js引入方法

    一,首先把下载好的分帧后台模板放到对应的目录中,HTML显示页面放到View目录中,CSS和JS.img图片等公共资源放到include目录中 二.然后开始准备更改CSS和JS , img路径操作:( ...

  5. win7 dos窗口模拟帧刷新

    前几天是白色情人节,临时脑抽写了个表白神器 高端大气上档次,就是不知道该送给谁,经过两天的反射弧思考决定还是写给博客娘吧.- -~ 这个程序就是打开后,在Dos窗口内模拟写出几行字母.其实主要就是模拟 ...

  6. Laya 分帧加载优化

    Laya 分帧加载优化 @author ixenos Flash中的EnterFrame事件在Laya中等同于Laya.timer.frameLoop(1,...) Laya.timer.frameL ...

  7. Laya 使list渲染支持分帧的思路

    Laya 使list渲染支持分帧的思路 @author ixenos 2019-09-06 1.由于Laya的list渲染时没有做分帧处理,只做了延迟帧处理,所以当单页元素较多时,会有大量运算卡帧的情 ...

  8. CAN分帧接收实现

    该版本程序实现了上电后先发送MACID检测功能,如果网络上有应答.则一直进行死循环,直到用户更改了本机的ID地址 才可以跳出循环体. 本单片机设置为双滤波 ,使目标地址为0X1F 实现了建立连接命令 ...

  9. CAN分帧发送程序说明

    试验平台 仅仅 需要一台主机 一台 周立功 CAN 助手, 一个232 助手就OK ICAN 协议 资源节点地址 电脑 我认为是0x01 51单片机主机的地址 是 0x1f 建立连接的 功能码 是0x ...

随机推荐

  1. WebService是什么

    Webservice的一个最基本的目的就是提供在各个不同平台的不同应用系统的协同工作能力. 其实WebService并不是什么神秘的东西,它就是一个可以远程调用的类,或者说是组件. 为什么要使用Web ...

  2. Redis与Java - 实践

    Redis与Java - 实践 标签 : Java与NoSQL Transaction Redis事务(transaction)是一组命令的集合,同命令一样也是Redis的最小执行单位, Redis保 ...

  3. 使用TypeScript开发程序

    简介 TypeScript一直发展不错,我们公司在开发新功能时,考虑到程序的可维护性,使用了TypeScript编写浏览器上的程序,我们是从零开始使用TypeScript,甚至我连javascript ...

  4. apache 访问权限基本设置

            1 .禁止访问某个或多个文件夹 在.htaccess文件里面写入 RewriteRule ^foldername - [F,L]    #禁止访问某个文件夹 RewriteRule ^ ...

  5. tab切换类

    /* * 传入id和点击时的回调函数,可以传第三个参数,就是当前tab的类名默认tabon * 主要完成tab的外观,就是当前tab的切换,完成外观切换后,会调用传入的回调函数 */ function ...

  6. hdu 4607 Park Visit

    http://acm.hdu.edu.cn/showproblem.php?pid=4607 先求树的直径 方法:两遍bfs ,任选一点 a  求到a点最远的一点b ,然后 求到b点最远点 c 这样 ...

  7. java.io中流的操作：字节流、字符流

    java.io中流的操作:字节流.字符流(1)使用File类打开一个文件(2)通过字节流或字符流的子类指定输出的位置(3)进行读/写操作(4)关闭输入/输出 1.字节流:主要是byte类型数据,以by ...

  8. Android Phonebook编写联系人UI加载及联系人保存流程（六）

    2014-01-07 11:18:08 将百度空间里的东西移过来. 1. Save contact 我们前面已经写了四篇文章,做了大量的铺垫,总算到了这一步,见证奇迹的时刻终于到了. 用户添加了所有需 ...

  9. [开发笔记]-“在引用COM组件时，出现了无法嵌入互操作类型。。。”的错误

    这两天在做一个需要将wps文档转换成word文档的程序,在调用wps的com组件时项目编译是没有问题的,但当运行的时候却弹出了下面的错误提示: 从网上百度一番后,找到了正确的解决方法. 先从Com组件 ...

  10. 基于Lumisoft.NET组件的POP3邮件接收和删除操作

    From: http://www.cnblogs.com/wuhuacong/archive/2013/05/06/3063093.html Lumisoft.NET组件是一个非常强大的邮件发送.邮件 ...