今天在做onebyone作业的时候，为了使自己的页面更加美观，我便使用了frame框架，百度了他的用法，总结如下

frame，是网页开发必须掌握的知识。例如后台架构、局部刷新，页面分割，都是frame的用途表现，尤其是后台页面制作，使用frame会给用户带来非常舒适的使用感受。
frame知识点包括（frameset标签、frame标签、iframe标签）。下面就对其一一介绍。
一、frameset

1. 属性

①border

设置框架的边框粗细。
②bordercolor
设置框架的边框颜色。
③frameborder
设置是否显示框架边框。设定值只有0、1；0 表示不要边框，1 表示要显示边框。
④cols
纵向分割页面。其数值表示方法有三种：“30%、30（或者30px）、*”；数值的个数代表分成的视窗数目且数值之间用“,”隔开。“30%”表示该框架区域占全部浏览器页面区域的30%；“30”表示该区域横向宽度为30像素；“*”表示该区域占用余下页面空间。例如：cols="25%,200,*" 表示将页面分为三部分，左面部分占页面30%，中间横向宽度为200像素，页面余下的作为右面部分。
⑤rows
横向分割页面。数值表示方法与意义与cols相同。
⑥framespacing
设置框架与框架间的保留的空白距离。

2. 用例

<frameset cols="213,*" frameborder="no" border="0" framespacing="0">
注意1：
cols与rows两属性尽量不要同在一个<frameset>标签中使用。若要实现下图架构，代码正确写法为：
<frameset rows="59,*" cols="*" frameborder="no" border="0" framespacing="0">
  <frame src="top.jsp" name="topFrame" scrolling="No" noresize="noresize" id="topFrame"/>
  <frameset cols="213,*" frameborder="no" border="0" framespacing="0">
    <frame src="left.jsp" name="leftFrame" scrolling="No" noresize="noresize" id="leftFrame"/>
    <frame src="main.jsp" name="mainFrame" id="mainFrame"/>
【即，若想即使用cols又使用rows，可利用frameset嵌套实现】
注意2：
<frameset cols="40%,*,*">
意思是：第一个框架占整个浏览器窗口的40%,剩下的空间平均分配给另外两个框架。
<frameset cols="*,*,*,*">
意思是：浏览器窗口等分为四部分。
 
二、frame
1. 属性
①name
设置框架名称。此为必须设置的属性。
②src
设置此框架要显示的网页名称或路径。此为必须设置的属性。
③scrolling
设置是否要显示滚动条。设定值为auto, yes, no。
④bordercolor
设置框架的边框颜色。

⑤frameborder

设置是否显示框架边框。设定值只有0、1；0 表示不要边框，1 表示要显示边框。

⑥noresize

设置框架大小是否能手动调节。
⑦marginwidth
设置框架边界和其中内容之间的宽度。
⑧marginhight
设置框架边界和其中内容之间的高度。
⑨width
设置框架宽度。
⑩height
设置框架高度。
2. 用例
<frame src="top.jsp" name="topFrame" scrolling="No" noresize="noresize" marginwidth="10" marginhight="10" width="400" height="800" />
 
三、iframe
是浮动的框架（frame），其常用属性与frame类似，其他的主要有以下（相同的就不列举了）
1. 属性
①align
设置垂直或水平对齐方式
②allowTransparency
设置或获取对象是否可为透明。
2. 用例
<iframe name="123" align="middle" marginwidth="0" marginheight=0 src="*.jsp" frameborder="0" scrolling="no" width="776" height="2500"></iframe>
注意：
iframe标签与frameset、frame标签的验证方法不同，是XHTML 1.0 Transitional。且iframe是放在body标签之内，而frameset、frame是放在body标签之外。
 
四、综合示例
<html>
<head>
<title>综合示例</title>
</head>
<frameset cols="25%,*">
<frame src="menu.htm" scrolling="no" name="Left">
<frame src="page1.htm" scrolling="auto" name="Main">
<noframes>
<body>
<p>对不起，您的浏览器不支持“框架”！</p>
</body>
</noframes>
</frameset>
</html>
【说明】
<noframes></noframes>标志对也是放在<frameset></frameset>标志对之间，用来在那些不支持框架的浏览器中显示文本或图像信息。在此标志对之间先紧跟<body></body>标志对，然后才可以使用我们熟悉的任何标志。

frame标签使用的更多相关文章

  1. 区别CSS中display：box；inline；none以及HTML中 <frame> 标签<table> 标签的 frame 属性

    区别display:box:display:inline:display:none三者的不同 display:block的特点是: block是Display默认的值.总是在新行上开始:该对象随后的内 ...

  2. HTML <frame> 标签的 src 属性

    HTML <frame> 标签 实例 src 属性规定在框架中显示的文档的位置: <html> <frameset cols="50%,50%"> ...

  3. 如何给frame标签的src属性以及a标签的href属性自动设值

    <frame src="" id="main" name="main" marginwidth="0" margi ...

  4. html <frame>标签使用

    标签定义 frameset 中的一个特定的窗口(框架) frameset中的每个框架都可以设置不同的属性,比如border,scrolling,noresize等 frame的常用属性 width: ...

  5. <iframe>和<frame>标签属性详解

    iframe>元素会创建包含另外一个文档的内联框架(即行内框架): 一.align 属性(不赞成) align属性规定iframe相对于周围元素的水平和垂直对齐方式,因为iframe元素是行内元 ...

  6. frame标签

    frame中有一个属性scrolling,可以这样设置它 <frame src="top.html" noresize scrolling="no"/&g ...

  7. frame标签和frameset

    框架: 属性 值 描述 frameborder 0 1 规定是否显示框架周围的边框. longdesc URL 规定一个包含有关框架内容的长描述的页面. marginheight pixels 定义框 ...

  8. Tkinter 之Frame标签

    一.参数说明 语法 作用 width 设置 Frame 的宽度默认值是 0 height 设置 Frame 的高度默认值是 0 background(bg) 设置 Frame 组件的背景颜色 bord ...

  9. Window 对象 HTML框架标签（Frame）

    Window 对象 Window 对象表示浏览器中打开的窗口. 如果文档包含框架(frame 或 iframe 标签),浏览器会为 HTML 文档创建一个 window 对象,并为每个框架创建一个额外 ...

随机推荐

  1. hdu 4651 Partition && hdu 4658 Integer Partition——拆分数与五边形定理

    题目:http://acm.hdu.edu.cn/showproblem.php?pid=4651 参考:https://blog.csdn.net/u013007900/article/detail ...

  2. ES(3): ES Cluster Extended Azure Storage

    Azure VM的磁盘空间远远不能满足ES集群存储需求(还需除掉VM的临时盘),同时也未找着ES配置 block blob storage 存储的组件,因此下文介绍通过挂载附加盘的方式增加ES集群存储 ...

  3. 【Spring-AOP-学习笔记-3】@Before前向增强处理简单示例

    项目结构 程序代码 HelloImpl.java WorldImpl.java 定义切面类 package org.crazyit.app.aspect; import org.aspectj.lan ...

  4. 【Hibernate学习笔记-6.1】无连接表的N-1关联（单向）

    作者:ssslinppp       1. 摘要 主要讲解N-1关系表的设计,N:从表,1:主表: 从表(N)中使用外键关联到主表(1),单向的: 场景: 许多人(N)可以住在同一个地方(1),知道人 ...

  5. 利用spring的ApplicationListener实现springmvc容器的初始化加载--转

    1.我们在使用springmvc进行配置的时候一般初始化都是在web.xml里面进行的,但是自己在使用的时候经常会测试一些数据,这样就只有加载spring-mvc.xml的配置文件来实现.为了更方便的 ...

  6. 用Keras搭建神经网络 简单模版（一）——Regressor 回归

    首先需要下载Keras,可以看到我用的是TensorFlow 的backend 自己构建虚拟数据,x是-1到1之间的数,y为0.5*x+2,可视化出来 # -*- coding: utf-8 -*- ...

  7. java发送http请求,内容为xml格式&&传统URI类请求

    import java.io.BufferedInputStream; import java.io.BufferedReader; import java.io.ByteArrayOutputStr ...

  8. 关于DELL服务器如果采购散件，进行服务器升级的相关说明

    拿DELL服务器内存来说明这个情况,其他硬盘等等是 一样的: 1.DELL服务器的内存散件,从购买之日起,质保期是一年: 2.但是如果你把内存插到能兼容这个内存的服务器上去使用,请注意我的字眼,是能兼 ...

  9. JpGraph使用详解之中文乱码解决方法

    在前面的JpGraph使用详解这篇文章,已经对JpGraph的使用方法作了详细的交代,前面说好的,接下来解决中文乱码. JpGraph为什么会出现中文乱码 在JpGraph中默认是要把字符串转成utf ...

  10. BTree,B-Tree,B+Tree,B*Tree的数据结构

    B树 即二叉搜索树: 1.所有非叶子结点至多拥有两个儿子(Left和Right): 2.所有结点存储一个关键字: 3.非叶子结点的左指针指向小于其关键字的子树,右指针指向大于其关键字的子树: 如: B ...