网页html分帧

最新推荐文章于 2021-06-16 23:03:53 发布

梨花IP异常

最新推荐文章于 2021-06-16 23:03:53 发布

阅读量603

点赞数

本文介绍了如何使用HTML的<frameset>和<frame>标签进行页面分帧，实现将浏览器窗口划分为多个区域，每个区域独立加载不同网页内容的方法。文章通过实例演示了分帧的基本设置，包括行和列的比例分配、边框控制等。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

转载自：http://blog.sina.com.cn/s/blog_8292a06a01013ka5.html

之前都是自学，所以这次遇到一个项目，有人告诉我可以用分帧，会好一点，于是我去百度了下，很棒~

要点：
HTML窗口分帧
把一个浏览器文档窗口分隔成多个窗口，每个窗口都可以显示一个独立的网页文件
每个帧（即页面）都有自己的url
通常是后台的首页会用到窗口分帧

帧标签
1、<frameset>标签：分帧
分帧和<body>及内容不能混合！！
rows(行)0,cols(列),border(边框大小),frameborder (边框与否)
rows(行),cols(列)：分隔形式可以是固定值、百分比和*三种
-每一个分帧都要对应一个url
frameborder：确定是否需要边框，需要的话为1，不要的话为0
border：确定边框的宽度

2、<frame>标签
src
name
scorelling(滚动条，用在内容多的情况，当其值为"no"时，取消滚动条)
noresize(不能调尺寸)

3、<a href="">的target属性
四个内置的取值：blank,parent,self,top

4、<noframes>标签
使用microsoft visual studio.NET创建框架集
5、<iframe>标签

效果图：
#HTML# <wbr> <wbr> <wbr>HTML窗口分帧
源代码：
index.html:

<html>

<head>
<title>网站后台管理</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" >
</head>
<frameset rows="100,*" background="images/bg.png"> 
<frame src="header.html" name="top">
<frameset cols="100,*" noresize>
<frame src="menu.html" name="left">
<frame src="main.html" name="right">
<frameset>
</frameset>
</html>

#HTML# <wbr> <wbr> <wbr>HTML窗口分帧
源代码：

header.html:
<center><h1>后台管理页面头部</h1></center>
<a href="menu1.html" target="left">第一项</a>||
<a href="menu2.html" target="left">第二项</a>||
<a href="menu3.html" target="left">第三项</a>||
<a href="menu4.html" target="left">第四项</a>||

#HTML# <wbr> <wbr> <wbr>HTML窗口分帧

源代码：
main.html
<center><h3>主体部分</h3></center>
<a href="" target="right"></a>
<center><iframe src="http://www.baidu.com" width="700" height="100"></center>

#HTML# <wbr> <wbr> <wbr>HTML窗口分帧
源代码：
menu.html:

<center><h3>选项部分</h3></center>
<center><a href="">第一页</a></center><br>
<center><a href="">第二页</a></center><br>
<center><a href="">第三页</a></center><br>
<center><a href="">第四页</a></center><br>
<center><a href="">第五页</a></center><br>
<center><a href="">第六页</a></center><br>
<center><a href="">第七页</a></center><br>
<center><a href="">第八页</a></center>