网页浏览器其实就是一个单一的框架,通过HTML标记的加入,我们可以将该单一框架分割成多个框架,并在每个框架中显示指定的网页。
多框架的基本结构
<frameset> 用来声明设置多框架结构
<frame>
<frame>
<frame>
</frameset>
注意,使用<frameset>标记时要删除<body></body>标记,二者不可共存
<frameset>标记有如下属性名称:
属性名称 | 设定值 | 说明 |
cols | 像素 | 将网页分割成并列排布的多个框架 |
百分比 | ||
rows | 像素 | 将网页分割成垂直排布的多个框架 |
百分比 | ||
border | 像素 | 边框宽度 |
framespacing | 像素 | 页面与页面的边距 |
注意,在使用属性cols和rows进行窗体分割时,如果设定了其中一个框体的像素或百分比数值,而其他框体自动扩展,则设定值可以用*代替,例如:
<frameset cols="160,*"> 此例中将浏览器分割成并列排布的两个框体,其中左边框体的宽度固定为160像素,右边框体的宽度随着浏览器视窗大小自动扩展。
<frame>标记具有如下属性名称:
属性名称 | 设定值 | 说明 |
src | URL | 链接的页面 |
noresize | 输入后,框体大小将不能由浏览者自行调整 | |
scrolling | yes | 不管网页内容大小,都出现滚动条 |
no | 不管网页内容大小,都不出现滚动条 | |
auto | 让浏览器自己判断 | |
marginheight | 像素 | 设置垂直方向,内容与边界的距离 |
marginwidth | 像素 | 设置水平方向,内容与边界的距离 |
frameborder | 0/1 | 不出现/出现框体边线 |
多框体的嵌套
博客样式的多框体嵌套代码:
<frameset rows="20%,80%">
<frame src="URL">
<frameset cols="20%,80%">
<frame src="URL">
<frame src="URL">
</frameset>
</frameset>
也即先将页面分割成上下两部分,设置上半部分的网页URL。再将下半部分网页分割成左右两部分,依次设置左右两部分的网页URL。
多框体下的超链接
假如一个网页设置了左右两个框体,左边框体专门用来放导航菜单的超链接,右边框体专门用来显示内容,可以通过下面格式实现:
<frame name="框体名称"> (先用属性name将右边的框体命名)
<a href="URL" target="框体名称"> (在编写左边框体,给文字设定超链接时,增加属性target,设定值为刚才命名的框体名称)
悬浮框体的设置
<iframe></iframe>
属性名称 | 设定值 | 说明 |
height | 像素/百分比 | 设置框体高度 |
width | 像素/百分比 | 设置框体宽度 |