内嵌框架iframe

内嵌框架iframe

  • 内嵌框架就是在网页中嵌入一个网页,并让它在上一级网页中显示
  • 内嵌框架使用的标签是iframe标签
    • <iframe src=" URL "></iframe>
    • URL 指定独立网页的路径
  • 代码示例:
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>展示图片</title>
	</head>
	<body>
		<iframe name="photo" src="图片导航.html" width="20%" height="900px"></iframe>
		<iframe name="my_iframe" src="默认展示页面.html" width="78%" height="900px"></iframe>
	</body>
</html>
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>图片导航</title>
	</head>
	<body>
		<h1>我喜欢的图片展示</h1>
		<ul>
			<li><a href="img/CHiCO with HoneyWorks.jpg" target="my_iframe" >CHICO1</a></li>
			<li><a href="img/CHiCO with HoneyWorks2.jpg" target="my_iframe">CHICO2</a></li>
			<li><a href="img/exia.jpg" target="my_iframe">exia</a></li>
			<li><a href="img/睡觉的北极狐.jpg" target="my_iframe">北极狐</a></li>
			<li><a href="img/祈-1.jpg" target="my_iframe">祈妹</a></li>
			<li><a href="img/阳光穿透加拉霍奈国家公园中的森林.jpg" target="my_iframe">森林</a></li>
		</ul>
	</body>
</html>
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title><默认展示页面/title>
	</head>
	<body>
		默认展示列表,点击图片链接显示
	</body>
</html>

框架集合

  • frameset 元素可定义一个框架集
  • 它被用来组织多个窗口(框架)。每个框架存有独立的文档。在其最简单的应用中,frameset 元素仅仅会规定在框架集中存在多少列或多少行。必须使用 cols 或 rows 属性。
  • 框架集合:和body是并列的概念,不能将框架集合放入body中
  • 代码示例
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>框架集合</title>
	</head>
	<frameset rows="20%,*,30%">
		<frame src="" >
		<frameset cols="20%,*,30%">
			<frame src="" >
			<frame src="" >
			<frame src="" >
		</frameset>
		<frameset cols="50%,*">
			<frame src="" >
			<frame src="" >
		</frameset>
	</frameset>
</html>
posted @ 2021-02-14 22:15  殃奕  阅读(123)  评论(0编辑  收藏  举报