分帧
HTML 框架是划分窗口的技术 就是把一个窗口分隔成多个窗口 每个窗口显示不同的网页内容多用于后台 也叫做分帧
1.Frameset
注意 如果你在页面上写frameset 了那么就不能出现body 因为他们两个见面就打仗
<frameset></frameset>
常用属性:
Cols 分列单位可以写像素也可以写百分比 之后除上面内容外还可以写*(*代表剩余所有)
Rows 分行单位可以写像素也可以写百分比 之后除上面内容外还可以写*(*代表剩余所有)
Frameborder 分帧边框 0/1
Border 边框粗细
2.Frame
把窗口分成几份就要有对应的几个frame标签出现
<frame />
常用属性:
Name 给设置的区域一个名字 用作跳转使用
Src 默认的显示页面链接
Noresize 不允许调整边框
Scrolling 滚动条
Auto|yes 出现滚动条|no 不出现滚动条
列如,我们分三个页面作为不同的区域
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>分帧</title>
</head>
<frameset rows="15%,*">
<frame name="top" src="http://www.baidu.com" noresize scrolling="yes"/>
<frameset cols="30%,*">
<frame name="left" src="http://www.iqiyi.com" noresize/>
<frame name="right" src="http://www.bilibili.com" noresize/>
</frameset>
</frameset>
</html>
那么我们平时也用不到这些,更多的是对于后代界面的管理那么我们就会用到src属性列如
先搞一个后代页面主页
<!DOCTYPE html><html><head> ???<meta charset="UTF-8"> ???<title>1.HTML分侦(HTML框架)做一个后台管理界面</title></head><frameset rows="15%,*" border="1px"> ???<frame noresize name="top" src="top.html"></frame> ???<frameset cols="20%,*"> ???????<frame noresize name="laft" src="left.html"></frame> ???????<frame noresize name="right1" src="right1.html"></frame> ???</frameset></frameset></html>
对应的链接文件top.html
<!DOCTYPE html><html><head> ???<meta charset="UTF-8"> ???<title>top</title> ???<style type="text/css"> ???????h1{ width: 200px; ?margin: 0 auto; font: 楷体,宋体} ???</style></head><body> ???<h1>学生管理系统</h1></body></html>
对应的链接文件left.html
<!DOCTYPE html><html><head> ???<meta charset="UTF-8"> ???<title>left</title> ???<style type="text/css"> ???????h1{ margin: 0 auto; font: 楷体,宋体} ???</style></head><body> ???<div>学生管理系统</div><br> ???<a href="right1.html" target="right1">用户登录</a><br><br> ???<a href="right.html" target="right1">浏览用户</a></body></html>
对应的两个right1.html 和 right.html文件
<!DOCTYPE html><html><head> ???<meta charset="UTF-8"> ???<title>right1</title> ???<style type="text/css"> ???????body{ background: #CCECFF;} ???????table{ width: 260px; margin: 0 auto;} ???????tr{ height: 50px;} ???</style></head><body> ???<table border="0"> ???????<form action="" method="post"> ???????<caption><h1>用户登录界面</h1></caption> ???????<tr> ???????????<td>账号:</td> ???????????<td><input type="text" name="yhm"></td> ???????</tr> ???????<tr> ???????????<td>密码:</td> ???????????<td><input type="password" name="mima"></td> ???????</tr> ???????<tr> ???????????<td colspan="2"> <input name="tijiao" type="submit" value="登录"> <input name="chongxie" type="reset" value="重写"></td> ???????????<!-- <td></td> --> ???????</tr> ???????</form> ???</table></body></html>
<!DOCTYPE html><html><head> ???<meta charset="UTF-8"> ???<title>right</title> ???<style type="text/css"> ???????h1{ margin: 0 auto; font: 宋体} ???</style></head><body> ???<h1>用户一</h1> ???<h1>用户二</h1> ???<h1>用户三</h1></body></html>
其实主要的就是我们的a标签target的属性值一定要对应我们链接跳转 frame的
name="对应值" 就是 target="对应frame里面的name值" 列如
<a href="right1.html" target="right1">用户登录</a><a href="right.html" target="right1">浏览用户</a>
frameset就实现了框架内部跳转了,多用于网站后台
html---frameset怎么框架内部跳转——转自玉狐大神
原文地址:https://www.cnblogs.com/Life-is-Demo/p/9116328.html