大约 3 分钟
提示
现在基本已经弃用了,仅仅了解即可.
frameset分针框架
<!DOCTYPE html>
<html>
<head>
<title>分针框架</title>
<meta charset="utf-8" />
</head>
<!--
frameset分针框架(不能写入body中)
属性名： 属性值：
rows 横向切分，单位是像素或*(所有)
cols 纵向切分，单位是像素或*(所有)
frame 引入框架文件
属性名： 属性值：
src 引入文件的名称
有几个窗口就有几个 frame 点击要打开的页面 target="名称" frame 加载 添加 name="名称" (定义名称)
-->
<frameset rows="120,*">
<!--引入了一个top文件-->
<frame src="./top.html" />
<!--纵向切分-->
<frameset cols="180,*">
<!--引入左侧left文件-->
<frame src="left.html" />
<!--引入右侧right文件-->
<frame src="right.html" name="right" />
</frameset>
</frameset>
</html>- top.html
<h2>欢迎来到美国国家安全局后台管理中心</h2>
<h3>欢迎你：大BOSS</h3>- left.html
<ul>
<li><h3><a target="right" href="http://www.baike.com/wiki/%E7%BE%8E%E5%9B%BD%E6%B5%B7%E8%B1%B9%E9%83%A8%E9%98%9F">海豹部队管理</a></h3></li>
<li><h3><a target="right" href="https://baike.baidu.com/item/%E7%BE%8E%E5%9B%BD%E8%81%94%E9%82%A6%E8%B0%83%E6%9F%A5%E5%B1%80/297801?fr=aladdin&fromid=15415707&fromtitle=fbi">FBI管理</a></h3></li>
<li><h3><a target="right" href="http://www.chinahacker.com/index.asp">黑客管理</a></h3></li>
<li><h3><a target="right" href="http://baike.baidu.com/item/%E6%AD%A3%E4%B9%89%E8%81%94%E7%9B%9F/5476792">正义者管理</a></h3></li>
</ul>- right.html
<h2>欢迎来到美国国家安全局后台管理中心</h2>
<h3>欢迎你：大BOSS</h3>(后台案例)houtai.html
- houtai.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>后台首页</title>
</head>
<!-- 先分成2行1列 -->
<frameset rows="100,*" frameborder="1" border="20">
<frame name="top"noresize scrolling="no" src="./top.html"/>
<!-- 再分列就需要再嵌套frameset -->
<frameset cols="200,*" frameborder="1">
<!-- 有几个窗体就有几个frame -->
<frame name="left" scrolling="yes" src="left.html"/>
<frame name="main" scrolling="auto" src="left2.html"/>
</frameset>
<!-- 如果浏览器不支持的话就会显示下面这句话 -->
<noframes>
你的浏览器不支持HTML框架分帧
</noframes>
</frameset>
</html>- top.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>top</title>
</head>
<body>
<br/>
<br/>
<br/>
<a href="left.html" target="left">频道一</a>||
<a href="left2.html" target="left">频道二</a>||
<a href="left.html" target="main">频道三</a>||
<a href="left2.html" target="main">频道四</a>||
</body>
</html>- left.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>left</title>
</head>
<body>
<ul>
<li>
<ul>菜单一
<li>菜单项</li>
<li>菜单项</li>
<li>菜单项</li>
<li>菜单项</li>
</ul>
</li>
<li>
<ul>菜单一
<li>菜单项</li>
<li>菜单项</li>
<li>菜单项</li>
<li>菜单项</li>
</ul>
</li>
<li>
<ul>菜单一
<li>菜单项</li>
<li>菜单项</li>
<li>菜单项</li>
<li>菜单项</li>
</ul>
</li>
<li>
<ul>菜单一
<li>菜单项</li>
<li>菜单项</li>
<li>菜单项</li>
<li>菜单项</li>
</ul>
</li>
</ul>
</body>
</html>- left2.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>left2</title>
</head>
<body>
<ul>
<li>
<ul>菜单二
<li>菜单项</li>
<li>菜单项</li>
<li>菜单项</li>
<li>菜单项</li>
</ul>
</li>
<li>
<ul>菜单二
<li>菜单项</li>
<li>菜单项</li>
<li>菜单项</li>
<li>菜单项</li>
</ul>
</li>
<li>
<ul>菜单二
<li>菜单项</li>
<li>菜单项</li>
<li>菜单项</li>
<li>菜单项</li>
</ul>
</li>
<li>
<ul>菜单二
<li>菜单项</li>
<li>菜单项</li>
<li>菜单项</li>
<li>菜单项</li>
</ul>
</li>
</ul>
</body>
</html>- main.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>main</title>
</head>
<body>
</body>
</html>