HTML框架集
我们可以通过框架,在一个浏览器窗口中显示多个页面。
HTML框架集的使用十分简单,我们需要用到如下2个标签:
<frameset></frameset>
<frame></frame>
frameset的属性
frameset主要有以下属性:
rows
rows属性用于设定水平框架占原窗口面积。
例如:
<frameset cols="100, *"> 将窗口分为两个横向框架,第一个占100px,第二个占剩余部分。
<frameset cols="20%, 30%, 50%"> 将窗口分为三个横向框架,第一个占横向20%,第二个30%,第三个50%。
<frameset cols="100, *, 10%"> 将窗口分为三个横向框架,第一个占100px,第三个占10%,第二个占剩余部分。
cols
cols属性用于设定垂直框架占原窗口面积。
用法同rows。
frame的属性
- name 设定框架名称。
- src 指定框架内容。
- noresize 设置该frame边框可否被拉动。
- scrolling 设定frame是否有滚动条:yes,no,auto。
混合框架示例
<html>
<head>
<title>Frame Test</title>
</head>
<frameset rows="40%, 60%" noresize="noresize" bordercolor="gray">
<frame src="http://blog.csdn.net/a153375250">
<frameset cols="50%, 50%" noresize="noresize" bordercolor="gray" border=1>
<frame src="https://www.baidu.com/">
<frame src="https://guides.github.com/activities/hello-world/">
</frameset>
</frameset>
</html>
显示如下:
导航框架+显示框架
首先创建frameset.html:
frameset.html
<html>
<head>
<title>Frameset</title>
</head>
<frameset cols="10%, 90%" noresize="noresize" bordercolor="gray" border=1>
<frame src="frame_index.html" name="index">
<frame src="http://baidu.com" name="content">
</frameset>
</html>
其中第一个框架的src指向下面的导航页面index.html,<frame>
中target指定页面显示在name=content的框架中,也就是我们第二个frame。
index.html
<a href="http://www.baidu.com" target="content">baidu</a><br/>
<a href="http://blog.csdn.net/a153375250" target="content">csdn blog</a>
预览: