frameset标签及用法

最新推荐文章于 2023-10-02 01:20:11 发布

Sixology.

最新推荐文章于 2023-10-02 01:20:11 发布

阅读量4.6k

点赞数

分类专栏：前端学习

本文链接：https://blog.csdn.net/qq_44685099/article/details/103278439

版权

前端学习专栏收录该内容

8 篇文章 2 订阅

订阅专栏

最近在课上老师讲到一个有趣的标签
frameset标签

<frameset cols="3*,*,*">
    <frame name="top" src="http://www.baidu.com">
    <frame name="center" src="http://www.baidu.com">
    <frame name="bottom" src="http://www.baidu.com">
</frameset>

一、frameset元素可以定义一个框架集，包含在html标签之中，注意：当有frameset标签时就不能有body标签。

frame包含于frameset标签之下

二、frameset标签有两个必要的属性rows和cols

<frameset cols="3*,*,*">
这个属性是将整个网页分为三列
效果如图：

在这里插入图片描述

同样
<frameset rows="3*,*,*">
是将页面分为三行，这里就不上效果图了

我们以rows为例：

1、当rows后面的值取n个时（值与值之间用逗号隔开）相应的frameset标签下的frame的标签数目就要有n个
2、rows的取值有以下几种
属性值描述
cols pixels、%、* 定义框架集中列的数目和尺寸。
rows pixels、%、* 定义框架集中行的数目和尺寸。
3、frameset还可以设置相应的边框宽度颜色等

frameborder="1" border="1" bordercolor="blue"

4、通过以上设置出来的框架的大小是可以通过鼠标来改变大小的，但是可以设置一下

<frameset rows="90,*,90" noresize="noresize">
noresize设置了之后就不能改变大小了

下面我们看一个有趣的例子

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>html框架</title>
</head>
<frameset rows="90,*,*">
    <frame name="top" src="index.html">
    <frame name="center" src="http://www.baidu.com">
    <frame name="bottom" src="http://www.baidu.com">
</frameset>
</html>

这是设置了一个三行的框架，第一行是一个html文件，第二行和第三行都是百度的首页

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>index</title>
</head>
<body>
<a href="https://www.csdn.net" target="center">把中间的页面改成csdn首页</a>
<a href="https://www.sina.com.cn" target="bottom">把下面的页面改成新浪首页</a>
</body>
</html>
这是index文件的代码，是通过两个a标签改变中间的页面和下面的页面
值得注意的是a标签里target的值是和前面的frame的name属性的值是对应的

这篇文章将frames属性介绍的比较完整