HTML4框架

来源:互联网 发布:mac照片怎么导入iphone 编辑:程序博客网 时间:2024/05/19 02:24
 HTML Code 
1
2
3
4
5
6
<frameset rows="20,*">
<frame src="url"></frame>
<frameset cols="20,*"><frame src="url"></frame>
<frame src="url"></frame>
</frameset>
</frameset>
frameset属性:
①rows=“20,30,*"设置横向分割框架数目,横向分割3块,左边占20像素,中间块展30像素,右边占其余部分
           =“150,2*,3*,200"设置横向分割框架数目,横向分为4块,其中最左边和最右边设置150像素和200像素,第二区域占剩余部分的2/5,第三区域占剩余部分的3/5
           =“150,50%,*”设置横向分割框架数目,横向分为3块,最左边区域150像素,中间区域占整框架宽度的50%,剩余的部分为最右区域
② cols=“30,*”设置纵向框架分割的数目。同横向规则
③border=“2”设置边框的宽度
④bordercolor=“#F0F”设置边框的颜色 
⑤frameborder=“0”设置有无边框,1有,0无
⑥framespacing=“2”设置窗口之间的空白

frame属性:
①src=“url”框架对应的源文件地址
②name=“hh”框架名字,用于在哪儿窗口显示
③border=“2”框架边框宽度
④boedercolor=“#F0F”框架边框颜色
⑤frameborder=“yes”设置有无边框,有yes,无no
⑥marginwidth=“0”设置内容与左右边框的空白
⑦marginheight=“0”设置内容与上下边框的空白
⑧scrolling=“auto”
                =“yes”
                =“no”
设置是否加入滚动条,yes加入,no不加,autoz根据文本内容自动添加
⑨noresize不允许改变窗口大小,默认允许


实例:

 HTML Code frame.html
1
2
3
4
5
6
7
8
9
10
11
<html>
<head>
</head>
<frameset rows="150,*">
<frame src="top.html" name="top"></frame>
<frameset cols="300,*">
<frame src="left.html" name="left"></frame>
<frame src="main.html" name="main"></frame>
</frameset>
</frameset>
</html>

图片

 HTML Code left.html
1
2
3
4
5
6
7
8
9
10
11
12
13
<html>
<head>
</head>
<body>
<ul>
<li><a href="main.html" target="main">烤鸡翅</a></li>
<li><a href="main1.html" target="main">炸鸡翅</a></li>
<li><a href="main.html" target="main">红烧鸡翅</a></li>
<li><a href="main.html" target="main">糖醋鸡翅</a></li>
<li><a href="main.html" target="main">盐酥鸡翅</a></li>
</ul>
</body>
</html> 

图片

 HTML Code zuo1.html
1
2
3
4
5
6
7
8
9
10
11
12
13
<html>
<head>
</head>
<body>
<ul>
<li><a href="main.html" target="main">鱼汤</a></li>
<li><a href="main1.html" target="main">紫菜汤</a></li>
<li><a href="main.html" target="main">海鲜汤</a></li>
<li><a href="main.html" target="main">紫菜汤</a></li>
<li><a href="main.html" target="main">海鲜汤</a></li>
</ul>
</body>
</html> 

图片 

 HTML Code main.html
1
2
3
4
5
6
7
8
9
<html>
<head>
</head>
<body>
<p>
烤鸡翅烤烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅烤鸡翅
</p>
</body>
</html> 


 HTML Code main1.html
1
2
3
4
5
6
7
8
9
<html>
<head>
</head>
<body>
<p>
炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅炸鸡翅
</p>
</body>
</html>

图片

 HTML Code top.html
1
2
3
4
5
6
7
8
9
10
11
<html>
<head>
</head>
<body>
<a href="left.html" target="left">首页</a>
<a href="left.html" target="left">菜品</a>
<a href="left1.html" target="left"></a>
<a href="left.html" target="left">凉菜</a>
<a href="left.html" target="left">饮品</a>
</body>
</html>

图片
<noframset></noframeset>
当浏览器不支持<frameset>标签时候,显示<noframeset>的内容

<iframe></iframe>
iframe是内嵌的网页元素,也可以说是内嵌的框架,可以用它将一个HTML文档嵌入在另一个HTML中显示。
属性:
①src=“url”
框架对应的源文件地址
scrolling=“auto”
                =“yes”
                =“no”
设置是否加入滚动条,yes加入,no不加,autoz根据文本内容自动添加
name=“hh”框架名字,用于在哪儿窗口显示
 
⑤frameborder=“yes”设置有无边框,有yes,无no
⑥width=“2”框架的宽和高
⑦height=“2”框架的高

<frame>和<iframe>区别:
 
frame不能脱离frameSet单独使用,iframe可以
 
frame不能和body同时使用,iframe可以和body同时使用
 
嵌套在frameSet中的iframe必需放在body中,不嵌套在frameSet中的iframe可以随意使用
 
frame的高度只能通过frameSet控制;iframe可以自己控制,不能通过frameSet控制
 ⑤ iframe 可以放到表格里面。frame 则不行。
 
iframe是活动帧,  而frame是非活动帧  
Iframe标记又叫浮动帧标记,可以用它将一个HTML文档嵌入在一个HTML中显示。它和Frame标记的最大区别是在网页中嵌入的<Iframe></Iframe>所包含的内容与整个页面是一个整体,而<Frame></Frame>所包含的内容是一个独立的个体,是可以独立显示的。另外,应用Iframe还可以在同一个页面中多次显示同一内容,而不必重复这段内容的代码。  

<frameset>框架不能在body体内,有框架不能有body体