HTML框架详解：frameset与iframe-优快云博客

本文链接：https://blog.youkuaiyun.com/a1_s2_c3_/article/details/96974437

本文介绍了HTML中的框架结构，包括不被HTML5支持的<frameset>标签，详细讲解了如何设置行列比例、属性、frame属性，以及<noframes>的备用内容。此外，还探讨了内联框架<iframe>的用法，如设置高度、宽度、边框和滚动条，以及在不支持框架的浏览器中的处理方式。

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

框架结构是将两个国两个以上的网页组合起来，在同一个窗口中打开的网页结构，框架把一个网页分成几个独立的区域，每个区域为一个单独的HTML文件，显示时，每一个区域向一个单独的网页，可以有自己的滚动条，背景，标题等。

HTML 《frameset》标签 - HTML5 不支持

frameset>标签在一个页面中设置一个或多个框架，用代替了body></body，不能出现在body标签里。

frameset，框架集， frame，框架

<frameset语法：

<html>
 <head></head>

 <frameset>
   <frame src="menu.html">
   <frame src="content.html">
 </frameset>
</html>

frameset- 建立框架的标记，将在其中定义各个框架。
frame src- 指示框架显示内容URL地址。

<frameset - 设置行列比例

rows， cols
格式：

 <frameset rows="第一个高度,第二个高度*，*">

*号表示剩下的部分

两种表示方法：1是像素，2是百分比

<frameset rows="20%,30%，*">
<frameset rows="200,200，*">

还可以嵌套：

	<html>
	  <head></head>
		
	  <frameset rows="20%,*">分为了两块
	      <frame src="title.html">  第一块
	      <frameset cols="30%,*">  第二块又分为两块
	          <frame src="menu.html">
	          <frame src="content.html">
	      </frameset>
	  </frameset>
	</html>

frameset -属性

设置边框 frameborder和framespacing属性。注意：frameset和frameborder是相同的属性。

1frameborder-设置边框， 0值表示没有边框
2border- 修改边框的粗细（由Netscape浏览器使用）
3framespacing- 修改边框的粗细（由Internet Explorer浏览器使用）

	<html>
	  <head></head>
	
	  <frameset border="0" frameborder="0" framespacing="0" rows="20%,*">
	      <frame src="title.html">
	      <frameset border="0" frameborder="0" framespacing="0" cols="30%,*">
	          <frame src="menu.html">
	          <frame src="content.html">
	      </frameset>
	  </frameset>
	</html>

设置名字：标签中我们使用name属性命名每个框架，而不是内容页面。

设置滚动：标签中我们使用noresize设置禁止用户拖拉框架大小；scrolling用于设置滚动条是否显示。

<html>
  <head></head>
	
  <frameset border="2" frameborder="1" framespacing="2" rows="20%,*">
      <frame src="title.html" noresize scrolling="no">
      <frameset border="4" frameborder="1" framespacing="4" cols="30%,*">
          <frame src="menu.html" scrolling="auto" noresize>
          <frame src="content.html" scrolling="yes" noresize>
      </frameset>
  </frameset>
</html>

noresize- 不允许用户更改其尺寸。
scrolling- 设置滚动条是否显示。

设置边框颜色 bordercolor

frame属性

src 每一框架都有一个单独的框架页面，都是通过src来指定一个文件。

name用来指定一个窗口的名称，当完成了子窗口的定义，可以使用超链接显示网页的一个子窗口。

marginwidth：框架边框和页面内容的水平边距。
marginheight：框架边框和页面内容的垂直边距。

scrolling:控制窗口框架中是否显示滚动条。

《noframes》

当别人使用的浏览器太旧时，不支持框架功能时，就会显示空白，使用这个标记给出一些提示性信息。

内联框架《iframe》

标签规定一个内联框架。

一个内联框架被用来在当前 HTML 文档中嵌入另一个文档。

通过使用框架，你可以在同一个浏览器窗口中显示不止一个页面。
iframe语法:

<iframe src="URL"></iframe>

该URL指向不同的网页。将窗口内容显示为URL地址指向页面。
属性

设置高度，宽度height和width属性用来定义iframe标签的高度与宽度。属性默认以像素为单位, 但是你可以指定其按比例显示 (如：“80%”).

<iframe src="demo_iframe.htm" width="200" height="200"></iframe>

移除边框：frameborder属性用于定义iframe表示是否显示边框。
　设置属性值为 “0” 移除iframe的边框:

在这里插入图片描述
设置边框：frameborder只能有1和0，或者yes或No，表示显不显示边框，

设置滚动条：scrolling:其值有三个选值
auto：表示看情况显不显示，
No：不显示
yes:显示

内联框不同于框架，他可以写在任何地方。比如一个表格中