HTML:框架

最新推荐文章于 2021-06-23 06:52:09 发布

xiazdong

最新推荐文章于 2021-06-23 06:52:09 发布

阅读量1.3k

点赞数 1

分类专栏：【Html、XHtml、CSS】文章标签： html 框架 iframe 浏览器 border

本文链接：https://blog.csdn.net/xiazdong/article/details/6827968

版权

【Html、XHtml、CSS】专栏收录该内容

9 篇文章 0 订阅

订阅专栏

框架对于设计网页的格局很重要，并且能够在一个框架中的某个部分重新载入，而不需要整个网页一起载入。

常见应用：导航栏。

最简单的框架就是一个浏览器分为2个框，

<head>

</head>

</frameset>

</noframes>

<frameset>元素：创建了一个框架，代替<body>元素。

如果有frameset，则就不需要body元素了。

<frameset>的属性：

(1)border：边框.

(2)frameborder：三维边框。

(3)rows:例如"30%,70%"可以创建一个第一行占30%的屏幕，第二行占70%的屏幕的框架。

(4)cols:

<frame>属性：

(1)frameborder：此框的边框。

(2)scrolling：这个框是否有滚动条，yes no auto

(3)src：页面来源。

(4)name：框架的名称，加载或定位时使用。

<html>
	<head><title>Books Previewer</title></head>
	<frameset cols = "90%,10%">	
		<frameset rows = "20%,60%,20%">
			<frame src = "nav.html"/>
			<frame src = "main.html" name = "main"/>
			<frame src = "foot.html"/>
		</frameset>
	</frameset>
	<noframes>
		<body>
			NO FRAME!!!
		</body>
	</noframes>
</html>

<iframe>浮动框架：

iframe属性：

(1)name:用于定位，target=""

(2)height：浮动框架最好设置高和宽

(3)width：浮动框架最好设置高和宽

(4)src：设置框架的源

(5)scrolling:是否有滚动条

<html>
	<head><title>Fruit</title></head>
	<body>
		<iframe name = "iframe" scrolling = "no" width = "200" height = "200" >Error</iframe><br />
		<a href = "images/orange.jpg" target = "iframe">orange</a><br />
		<a href = "images/apple.jpg" target = "iframe">apple</a><br />
		<a href = "images/banana.jpg" target = "iframe">banana</a><br />
	</body>
</html>