frameset应用

最新推荐文章于 2019-11-27 17:43:39 发布

汪喆_Jack

最新推荐文章于 2019-11-27 17:43:39 发布

阅读量456

点赞数 4

分类专栏：前端技术相关文章标签： frameset

本文链接：https://blog.csdn.net/qq_34829447/article/details/81393311

版权

前端技术相关专栏收录该内容

25 篇文章 0 订阅

订阅专栏

1.标签解析：

<frameset></frameset>frameset元素定义一个框架集，它被用来组织多个窗口（框架）。组织好在页面显示。

<frame></frame>frame标签定义frameset中的一个特定的窗口（框架）。嵌套在frameset标签中使用。

<noframe></noframe>在frameset标签中使用，如果浏览器不支持frameset框架，可以用它来提示消息

2.属性解析：

<frameset>的 rows：设置有多少行，rows=”103,*,43”表示有三行，第一行高103px，第三行高43px，中间一行占剩余的部分。rows=”50%,*”表示有两行，第一行占50%，第二行占剩余的。

<frameset>的cols：设置有多少列，cols=”*”表示有一列，

在rows和cols中属性值可以设置：* 代表自适应，%代表百分比，数字代表多少px，它们代表的意义一样。是frameset必备属性。

W3School解释了当设置的rows或cols属性值超出浏览器边界时的处理情况：

与表格一样，浏览器在显示时会尽可能接近给定的框架集尺寸。但是，浏览器不会为了能够容纳下超出边沿的框架集而扩展文档窗口的边界，也不会在指定的框架没有填满整个窗口时用空白区域来填满窗口。相反，浏览器会根据一个框架在行和列中相对于其他框架的大小来分配空间，这样就能够填满整个文档窗口了。

<frame>的scrolling：控制此窗口中是否显示滚动条，可以设置auto，yes，no。

<frame>的noresize=”noresize”：控制边框是否可移动，设置此属性的frame或者frameset，则它周边的边都是不可移动的。

3.页面跳转切换

利用name结合target完成页面跳转，将a标签的target属性设置成对应页面frame的name属性则实现点击将name属性的页面用a的href属性页面替换。

实例代码:

<!-- frame_a.htm -->
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
</head>
<body style="background-color: yellow">
    FrameA
    <br>
    <a href="./frame_c.htm" target="middleHTML">将中间页面切换成右侧页面颜色</a><br>
    <a href="./frame_b.htm" target="rightHTML">将右侧页面切换成中间页面颜色</a>
</body>
<html>

<!-- frame_b.htm -->
<!DOCTYPE html>
<html>
<head></head>
<body style="background-color: blue">
    FrameB
</body>
<html>

<!-- frame_c.htm -->
<!DOCTYPE html>
<html>
<head></head>
<body style="background-color: red">
    FrameC
</body>
<html>

<!-- frame_d.htm -->
<!DOCTYPE html>
<html>
<head></head>
<body style="background-color: green">
    FrameD
</body>
<html>

<!-- frame_e.htm -->
<!DOCTYPE html>
<html>
<frameset cols="20%,*,25%">
  <frame src="frame_a.htm" name="leftHTML">
  <frame src="frame_b.htm" name="middleHTML">
  <frame src="frame_c.htm" name="rightHTML">
</frameset>
</html>

<!-- frame_f.htm -->
<!DOCTYPE html>
<html>
<head></head>
<body style="background-color: orange">
    FrameF
</body>
<html>

<!-- frame_all.htm -->
<!DOCTYPE html>
<html>
<frameset rows="20%,*,20%">
    <frame src="./frame_d.htm"></frame>
    <frame src="./frame_e.htm"></frame>
    <frame src="./frame_f.htm"></frame>
</frameset>
</html>

效果图:
这里写图片描述

汪喆_Jack

关注

4
点赞
踩
10

收藏

觉得还不错? 一键收藏
0
评论
frameset应用

1.标签解析：&lt;frameset&gt;&lt;/frameset&gt;frameset元素定义一个框架集，它被用来组织多个窗口（框架）。组织好在页面显示。&lt;frame&gt;&lt;/frame&gt;frame标签定义frameset中的一个特定的窗口（框架）。嵌套在frameset标签中使用。&lt;noframe&gt;&lt;/noframe&gt;在frame...
复制链接

扫一扫