HTML的窗口分帧
下面通过一个后台管理的部分设计来说明窗口分帧
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的窗口分帧的更多相关文章
- HTML高级标签(2)————窗体分帧(2)————后台管理页面
使用frameset进行窗体分帧.构建简易的后台页面.这篇博客就作为一个简易后台管理页面的实战演练. watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvd3px ...
- HTTP2.0的二进制分帧
1.帧的类型: 在二进制分帧的结构中,头部有8个字节(64Bit),其中有一个字节(8Bit)来标志帧的类型: HTTP2.0规定了如下帧类型: DATA: 用于传输HTTP消息体 HEADERS:用 ...
- WPF中利用后台代码实现窗口分栏动态改变
在WPF中实现窗口分栏并能够通过鼠标改变大小已经非常容易,例如将一个GRID分成竖排三栏显示,就可以将GRID先分成5列,其中两个固定列放GridSplitter. <Grid Backgrou ...
- PHP分帧后台模板页面css样式,js引入方法
一,首先把下载好的分帧后台模板放到对应的目录中,HTML显示页面放到View目录中,CSS和JS.img图片等公共资源放到include目录中 二.然后开始准备更改CSS和JS , img路径操作:( ...
- win7 dos窗口模拟帧刷新
前几天是白色情人节,临时脑抽写了个表白神器 高端大气上档次,就是不知道该送给谁,经过两天的反射弧思考决定还是写给博客娘吧.- -~ 这个程序就是打开后,在Dos窗口内模拟写出几行字母.其实主要就是模拟 ...
- Laya 分帧加载优化
Laya 分帧加载优化 @author ixenos Flash中的EnterFrame事件在Laya中等同于Laya.timer.frameLoop(1,...) Laya.timer.frameL ...
- Laya 使list渲染支持分帧的思路
Laya 使list渲染支持分帧的思路 @author ixenos 2019-09-06 1.由于Laya的list渲染时没有做分帧处理,只做了延迟帧处理,所以当单页元素较多时,会有大量运算卡帧的情 ...
- CAN分帧接收实现
该版本程序实现了上电后先发送MACID检测功能,如果网络上有应答.则一直进行死循环,直到用户更改了本机的ID地址 才可以跳出循环体. 本单片机设置为双滤波 ,使目标地址为0X1F 实现了建立连接命令 ...
- CAN分帧发送程序说明
试验平台 仅仅 需要一台主机 一台 周立功 CAN 助手, 一个232 助手就OK ICAN 协议 资源节点地址 电脑 我认为是0x01 51单片机主机的地址 是 0x1f 建立连接的 功能码 是0x ...
随机推荐
- uva 10723
10723 - Cyborg Genes Time limit: 3.000 seconds Problem F Cyborg Genes Time Limit 1 Second Septembe ...
- html5 <input> placeholder 属性
带有 placeholder 文本的搜索字段: <form action="demo_form.asp" method="get"> <inp ...
- QQ输入法评价
用户界面: 用户可以通过登录QQ展现自己的QQ头像,可以点击头像显示用户信息,可以中英文切换,全半角切换,打开属性设置,以为软键盘 记住用户选择: 当用户使用QQ输入法时,QQ输入法可以记住用户当前的 ...
- HDU 5773 The All-purpose Zero 求LIS
求最长上升子序列长度: 单纯的dp时间复杂度是O(n*n)的 dp[i] = max(dp[j]+1); (0=<j<=i-1 && a[i]>a[j]) 用二分可以 ...
- php中文汉字截取函数
public function substrgb($in,$num) { //$num=16; $pos=0; $bytenum=0; $out=""; while($num){ ...
- OpenGL 和OpenGL ES简介
OpenGL的全称是Open Graphics Library,即开放的图形库接口,它定义了一个跨编程语言.跨平台的编程接口的规范,它主要用于三维图形(实际上二维图形也可以)变成.OpenGL的前 ...
- C#winform省市县联动,以及有的县是空值时显示异常的处理
一.如下comboBox1.comboBox2.comboBox3,原来这三个都是空的, 将数据库中的省份传递到comboBox1中 我的数据库有parent字段,根据市的parent找到省,根据县的 ...
- ScrollView中嵌入ListView,GridView冲突的解决(让ListView全显示出来)
ScrollView中嵌入原生ListView或GridView,会出现ListView,GridView显示不全的问题. 解决方法:重新构造一个ListView或GridView,重写OnMeasu ...
- 使用Google API 下拉刷新或者增加数据 SwipeRefreshLayout
贴出布局代码: <android.support.v4.widget.SwipeRefreshLayout android:id="@+id/id_swipe_ly" and ...
- 支持多人协作的在线免费作图工具:ProcessOn
之前朋友给我推荐一款作图工具ProcessOn,出于好奇我就研究了一下它,今天我就给大家简单介绍一下这款免费的在线作图工具:ProcessOn 首先使用ProcessOn我们需要有一个帐号,这样每次操 ...