首页 > web前端 > html教程 > HTML 框架集标签

HTML 框架集标签

WBOY
发布: 2024-09-04 16:30:32
原创
519 人浏览过

HTML 中的标签组合了多个框架并将它们显示为单个网页。该文档将包含框架集中包含的所有框架。框架只不过类似于单个窗口或网站。框架集标签允许我们形成多列或多行,并在它们下面包含框架。此功能在 HTML 5 之前就可用,对于通过将各种文档组合在一起来一次显示它们非常有用。每个框架都可以包含其内容;通常,这些是不同的网页文件,例如 HTML 或图像。

语法

这里的起始标签是

;并以结束标记作为 结束。 <框架集>标签可以包含一个或多个多帧标签。每个帧标签都以 开头。标签,属性名称为“src”,我们将在其中传递框架内容。如前所述,此内容可以是任何类似于 Web 文件的内容,例如 HTML 或传递图像。
<frameset cols / rows = ", , , " >
<frame src = "source file name. . . " >
. . . . . .
. . . . . .
<frame src = "source file name. . . " >
</frameset>
登录后复制

这里,我们有一个包含属性 cols 或 rows 的起始标签框架集。通常,这两个属性将与框架集标签一起使用,因为框架集标签用于组合多个框架。这些标签只不过是允许形成行或列来定位各种框架。起始标签后面跟着一个简单的帧标签。要在框架中显示文件,请在框架标记中使用“src”属性并将文件名作为其值传递。我们已经证明,单个帧可以使用点包含多个帧。最后,通过关闭标签

来关闭框架集标签。

frameset标签的属性

以下是框架集标签支持的属性列表:

1。 cols: 该属性用于定位内部框架。 cols 属性将框架集分成多列,垂直显示框架。此属性还允许设置框架集中每列的宽度。我们可以通过将值传递给该属性来为每个帧设置不同的值。该值可以以百分比、像素或相对长度的形式传递。该属性的默认值为 100%。

2。 rows: 该属性也类似于 cols 属性。 rows 属性会将框架集分成多行,框架将一一水平显示。我们可以通过类似于cols属性的值来设置每一帧的高度。通过同时使用行和列,可以实现预期的结果。该属性的默认值也是 100%。

3。 border: 此属性在框架集标签上使用,用于定义框架集中每个框架的宽度。

4。框架间距: 框架集标签使用“框架间距”属性来建立其中框架之间的间隙。

实现 HTML 框架集标签的示例

下面给出的是 HTML 框架集标签的示例:

示例#1

它包含多个 Html 文件,因为我们在一个父窗口中使用不同的文件作为框架。

代码:

主文件:

<!DOCTYPE html>
<html>
<head>
<title> frameset tag in HTML </title>
<style>
</style>
</head>
<frameset>
<frame src = "frame1.html" >
</frameset>
</html>
登录后复制

我们有一个名为frame 1 的源文件。

frame1.html:

<!DOCTYPE html>
<html>
<head>
<title> Frameset Example </title>
<style>
body {
text-align: center ;
background-color: rgb(120, 120, 120, 0.15) ;
}
</style>
</head>
<body>
<h2> Example of Frameset tag </h2>
<h1> Frame 1 </h1>
</body>
</html>
登录后复制

输出:

由于我们只有一个文件作为一个框架包含在内,因此页面将显示整个frame.html的内容。框架的宽度和高度默认为100%;这就是为什么单个框架会占据所有区域。

HTML 框架集标签

示例#2

让我们在示例中再添加一个框架,并使用 cols 属性按列划分它并以百分比形式传递值。

代码

frame2.html:

<!DOCTYPE html>
<html>
<head>
<title> Frameset Example </title>
<style>
body {
text-align: center ;
background-color: rgb(120, 120, 120, 0.30 ) ;
}
</style>
</head
<body>
<h2> Hello World..! </h2>
<h1> Frame 2 </h1>
</body>
</html>
登录后复制

主文件:

<!DOCTYPE html>
<html>
<head>
<title> frameset tag in HTML </title>
<style>
</style>
</head>
<frameset cols = "40% , 60 %" >
<frame src = "frame1.html" >
<frame src = "frame2.html" >
</frameset>
</html>
登录后复制

输出:

在这里,我们传递了两个帧,并使用 cols 属性将它们分开,传递的值分别为 40% 和 60%。使第一帧的宽度为 40%,第二帧的宽度为 60%。

HTML 框架集标签

示例#3

让我们使用 rows 属性水平划分相同的帧。我们将修改相同的最后一个示例。不同之处在于 rows 属性将取代 cols 属性。 rows 属性也采用与 cols 属性类似的值。我们可以根据帧数传递多个值。

代码

主文件:

<!DOCTYPE html>
<html>
<head>
<title> frameset tag in HTML </title>
<style>
</style>
</head>
<frameset rows = "50% , 50%" >
<frame src = "frame1.html" >
<frame src = "frame2.html" >
</frameset>
</html>
登录后复制

输出:

这里输出将是两个水平框架,高度相同为 50%。请注意,此高度将对应于实际的浏览器窗口。

HTML 框架集标签

结论

我们已经了解了 HTML 中的框架集标签、其用途以及如何使用它。该标签旨在在一个显示窗口上合并和展示多个框架。我们还可以使用可用的属性定义框架的位置和大小。该标签自 HTML 5 起已被弃用。

以上是HTML 框架集标签的详细内容。更多信息请关注PHP中文网其他相关文章!

来源:php
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板