1.在html标签中有一个iframe标签,此标签的意思是将一个子html页面嵌入到另一个html页面,我们把这个子页面也叫做内帧.
2.通过上面的小例子我们知道了如何通过ifame标签将一个html页面嵌入到另一个html页面中,通过这点我们可以搭建自己的html框架.
注意frameset标签不能放在body标签中.
访问FrameTest2.html文件,在top上面有一个change按钮,点击按钮,可以实现隐藏左边页面的功能,或者说是放大右边页面的功能.
总之通过上面的小例子我们可以借助frame搭建一个很实用的html框架.抓紧时间试试吧!
<html>
<head>
<title>FrameTest1</title>
</head>
<body>
我是主页面.
<table width="100%" align="center" border="1">
<tr>
<td>
<iframe name="child" width="100%" height="20%" src="Child.html"></iframe>
</td>
</tr>
</table>
</body>
</html>
Child.html代码如下:
<html>
<head>
<title>Child</title>
</head>
<body>
我是内帧.
</body>
</html>
显示结果略.
2.通过上面的小例子我们知道了如何通过ifame标签将一个html页面嵌入到另一个html页面中,通过这点我们可以搭建自己的html框架.
注意frameset标签不能放在body标签中.
<html>
<head>
<title>FrameTest2</title>
<script language="javascript">
leftState=0;
</script>
</head>
<frameset rows="20%,*" cols="*" border="1">
<frame name="top" scrolling="no" src="Top.html" noresize>
<frameset name="bottom" cols="20%,*" rows="*" border="1">
<frame name="left" scrolling="yes" src="Left.html">
<frame name="right" scrolling="yes" src="Right.html">
</frameset>
</frameset>
</html>
Top.html代码如下:
<html>
<head>
<title>Child</title>
<script language="javascript">
function operate(){
if(parent.leftState==0){
parent.leftState=1;
parent.bottom.cols="*,100%";
}else{
parent.leftState=0;
parent.bottom.cols="20%,*";
}
parent.bottom.location.reload();
}
</script>
</head>
<body>
<input type="button" name="operate" value="change" onClick="operate()">
</body>
</html>
Left.html代码如下:
<html>
<head>
<title>Child</title>
</head>
<body>
我是Left.
</body>
</html>
Right.html代码如下:
<html>
<head>
<title>Child</title>
</head>
<body>
我是Right.
</body>
</html>
通过上面的四个html文件我们的html框架就搭建好了,注意parent的意思是指父页面.
访问FrameTest2.html文件,在top上面有一个change按钮,点击按钮,可以实现隐藏左边页面的功能,或者说是放大右边页面的功能.
总之通过上面的小例子我们可以借助frame搭建一个很实用的html框架.抓紧时间试试吧!