HTML——框架

1、frameset

<html>

<frameset cols="25%,50%,25%">
  <frame src="frame_a.htm" />
  <frame src="frame_b.htm" />
  <frame src="frame_c.htm" />
</frameset>

</html>

  frameset 元素可定义一个框架集。它被用来组织多个窗口(框架)。每个框架存有独立的文档。在其最简单的应用中,frameset 元素仅仅会规定在框架集中存在多少列或多少行。您必须使用 cols 或 rows 属性。

      重要事项:您不能与 <frameset></frameset> 标签一起使用 <body></body> 标签。不过,如果您需要为不支持框架的浏览器添加一个 <noframes> 标签,请务必将此标签放置在 <body></body> 标签中!

       <frameset rows="100,*" frameborder="no">    --上下分,第一行100像素,剩余为第二行;rows换成cols,则上下分变为左右分。frameborder=“no”,去掉分割线。

          <frame src="页面地址" noresize="noresize">    --noresize,禁止窗口调整大小

          <frame src="" scrolling="no">    --scrolling="no",取消显示滚动条

  </frameset>

在超链接指定目标页面显示在哪个框架窗口中

  第一步:给要显示内容的目标frame设置name属性

     第二步:给超链接的target属性赋值成第一步设置的name

例如:

Untitled-3.html中的一个超链接在 Untitled-2.html 所在的框架区域显示。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1
transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>框架</title>
</head>

<frameset rows="100,*">
    <frameset cols="100,*">
    <frame src="Untitled-1.html"/>
    <frame src="Untitled-2.html" name="aa"/>
    </frameset>
<frame src="Untitled-3.html"/>
</frameset><noframes></noframes>

</html>
Untitled-3.html中需要添加的内容
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>测试网页</title>
</head>

<body>
<a href="http://www.w3school.com.cn/" target="aa">测试框架跳转 </a>
</body>

</html>
让整个frameset页面跳转至某个页面:

    把超链接的target属性设置为“_top”。

2、iframe

在原来页面嵌入小窗口显示其他页面

属性描述
align
  • left
  • right
  • top
  • middle
  • bottom

不赞成使用。请使用样式代替。

规定如何根据周围的元素来对齐此框架。

frameborder
  • 1
  • 0
规定是否显示框架周围的边框。
height
  • pixels
  • %
规定 iframe 的高度。
longdesc URL 规定一个页面,该页面包含了有关 iframe 的较长描述。
marginheight pixels 定义 iframe 的顶部和底部的边距。
marginwidth pixels 定义 iframe 的左侧和右侧的边距。
name frame_name 规定 iframe 的名称。
sandbox
  • ""
  • allow-forms
  • allow-same-origin
  • allow-scripts
  • allow-top-navigation
启用一系列对 <iframe> 中内容的额外限制。
scrolling
  • yes
  • no
  • auto
规定是否在 iframe 中显示滚动条。
seamless seamless 规定 <iframe> 看上去像是包含文档的一部分。
src URL 规定在 iframe 中显示的文档的 URL。
srcdoc HTML_code 规定在 <iframe> 中显示的页面的 HTML 内容。
width
  • pixels
  • %
定义 iframe 的宽度。

    <iframe src="其他页面的地址" width="" height="" frameborder="0" scrolling="no"></iframe>

    frameborder,边线;scrolling,滚动条。如果设置高和宽为0,则不显示,但是在后台会存在这么一个页面,例如熊猫烧香病毒。




原文地址:https://www.cnblogs.com/SJP666/p/4694096.html