页面框架 frameset
帧 frame。
分割浏览器页面,不能放在body内。
frameset 属性
| rows |
横向分割 |
px，%，*(剩余高度) |
| cols |
纵向分割 |
px，%，*(剩余高度) |
| border |
边框 |
0,1 |
| frameborder |
是否显示框架周围的边框 |
0,1 |
frame 属性
| noresize |
无法调整框架的大小 |
|
| scrolling |
是否在框架显示滚动条 |
yes,no,auto |
| margin-height |
框架上边和下边的边距 |
|
| margin-width |
框架左侧和右侧的边距 |
|
横向分割
<frameset rows="33%,33%,33%">
<frame src="http://www.baidu.com"/>
<frame src="http://www.runoob.com" />
<frame src="http://www.alibaba.com" />
</frameset>
纵向分割
<frameset cols="33%,33%,33%">
<frame src="http://www.baidu.com"/>
<frame src="http://www.runoob.com" />
<frame src="http://www.alibaba.com" />
</frameset>
混合(横、纵)
<frameset rows="100px,*" border="0">
上
<frame src="../../0917/work/2.html" scrolling="no"/>
下
<frameset cols="*,*">
<frame src="../../0918/work/1.html" />
<frame src="../../0918/work/4.html" noresize />
</frameset>
测试
frame.html
<frameset rows="100px,*">
<frame src="title.html" />
<frameset cols="200px,*">
<frame src="list.html" />
<frame src="" name="work" />
</frameset>
</frameset>
list.html
<head>
<style>
a{
text-decoration: none;
color: #000;
}
a:hover{
color: #f1c40f;
font-size: 18px;
}
body{
background:linear-gradient(rgba(180,180,180,.4),rgba(255,255,255,1),rgba(180,170,180,.4));
}
</style>
</head>
<body>
<dl>
<dt>0917</dt>
<dd><a href="../../0917/work/1.html" target="work">HTML简介</a></dd>
<dd><a href="../../0917/work/2.html" target="work">课程表</a></dd>
<dd><a href="../../0917/work/3.html" target="work">3x3合并</a></dd>
<dt>0918</dt>
<dd><a href="../../0918/work/1.html" target="work">用户注册页面</a></dd>
<dd><a href="../../0918/work/2.html" target="work">列表</a></dd>
<dd><a href="../../0918/work/3.html" target="work">AAA有限公司</a></dd>
<dd><a href="../../0918/work/4.html" target="work">个人简历</a></dd>
</dl>
</body>
title.html
<body bgcolor="#ffd700">
<h1 align="center">作业</h1>
</body>
