转自:https://i.cnblogs.com/posts?categoryid=1121494

框架(Frame)也就是所谓的分割窗口、分割画面、框窗效果(还真是五花八门),这个技巧在运用上问题比较多,用的好的话,有助于网友快速且有条理的浏览网页,整理不好的话,呵呵...那笑话可就闹大了。

【框架的基本概念】 
 1. 首先,各位先看看右手边这张图,我们将利用这张图来作解说,这样子,讲起来可能会清楚一点。 OK!我们可以看见,右边的这个窗口,一共分为 1 、 2 、 3 三个框架,每一个框架,各有其显示的内容分别是a.htm、b.htm、c.htm三个档案。然而左下角的那个 index.htm 是做什么用的呢?  
2. 原来,左下角的这个档案 index.htm,就是要告诉计算机,我们要将画面分割成这样,也就是说,所有Frame的卷标,其实都只摆在 index.htm 这个档案里。(当然,不是档名一定要叫做 index.htm 取其它档名也是可以的。) 
3. 这样明白了吗?总之,您要分割几个框框,就一定会有几个对应的html档案(假如您要分割100个框框,就要有100个html档就对了。),另外,还会多一个档案是来告诉计算机要如何分割的。(也就是例中的 index.htm 档啦!)

【开始分割】 
1. 别急、别急,分割窗口可是一门学问,要分割也是要一步一步来的。看看刚刚那例子,想象画面是一个蛋糕,你要怎么割,才能割成那样呢?

原始码 呈现结果
<HTML>
<HEAD>
<TITLE>框窗实作</TITLE>
</HEAD>
</HTML>
 

2. 各位会发现,奇怪,在上面的语法中,怎么都没见到<BODY></BODY>熟悉的身影?呵呵...没错,它已经被待会儿要加进去的<FRAMESET></FRAMESET>卷标给取代了!也就是说,如果我们要分割画面,就要先用<FRAMESET>卷标告诉计算机说:『喂!我要开始分割了!』此时,<BODY>是派不上用场的,所以躲到一旁凉快去了!  
3. 现在开始动手割割看啰!我们先将画面分成左右两边(左边就是框窗 1 了,右边就暂定为 2 等一下还要分割呢!),如下图:

原始码 呈现结果

<HTML>
<HEAD>
<TITLE>框窗实作</TITLE>
</HEAD>
<FRAMESET COLS=120,* > 
 <FRAME SRC=a.htm NAME=1>
 <FRAME SRC=b.htm NAME=2> 
</FRAMESET> 
</HTML>  
   

4. 在<FRAMESET>中,我们要告诉计算机到底是要左右分(COLS)?还是上下分(ROWS)。一开始我们是左右分,所以我们写成<FRAMESET COLS=120,* >。COLS=120,* 就是说,左边那一栏强制定为 120点,右边则随窗口大小而变。除了直接写点数外,我们亦可用百分比来表示,例如COLS=20%,80%也是可以的。

5. 然后,再将右边的框窗再割成上下两个画面(也就是框窗 2 和 3 了)。如下图:

原始码 呈现结果

<HTML>
<HEAD>
<TITLE>框窗实作</TITLE>
</HEAD>
<FRAMESET COLS=120,*>
 <FRAME SRC=a.htm NAME=1>
 <FRAMESET ROWS=100,*>
  <FRAME SRC=b.htm NAME=2>
  <FRAME SRC=c.htm NAME=3>
 </FRAMESET>
</FRAMESET>
</HTML>  
   
 

6. 看见了没?原本的<FRAME SRC=b.htm NAME=2>(在第 3 点的语法中)被另一组<FRAMESET ROWS=100,* >所取代了!所以要注意喔!第二组<FRAMESET ROWS=100,* >是被第一组<FRAMESET COLS=120,* >所包围起来的喔!(乱七八糟了对不对?)
7. 呵呵...不知不觉就大功告成了,其实只要将最后完成的那些语法存成 index.htm,然后再准备三个档 a.htm 、b.htm 、c.htm那么就完工啰!当然,这是一个最简单的分割法,我们会再将一些进阶的卷标在底下一一说明。
【其它卷标参数说明】
<FRAMESET COLS=120,* frameborder=0 framespacing=5> 
1. COLS=120,*
就是垂直切割画面啦!你可以一次切成左右两个画面,当然也可以切成三个,很简单只要写成 COLS=30,*,50 (数字随便您自己调整啦!),依此类推,四个以上当然就是四组数字啦!

2. ROWS=120,*
就是横向切割画面,也就是将画面上下分开,切法同上。

3. frameborder=0
设定框架的边框,其值只有 0 和 1 , 0 就是不要边框, 1 就是要显示边框。边框是无法调整粗细的。

4. framespacing=5
表示框架与框架间的保留空白的距离,以免看起来太挤。 
<FRAME SRC=a.htm NAME=1 frameborder=0 scrolling=no noresize marginhight=2 marginwidth=2> 
1. SRC=a.htm
设定此框架中要显示的网页名称,每个框架一定要对应一个网页,否则就会产生错误,这里就是要您填入对应网页的名称。(如果该网页在不同目录,记得路径要写清楚) 
2. NAME=1
设定这个框架的名称,这样才能指定框架来作连结,所以一定要设定喔!当然名称随你高兴取名。
3. frameborder=0
设定框架的边框,其值只有 0 和 1 , 0 就是不要边框, 1 就是要显示边框。边框是无法调整粗细的。 
4. scrolling=no
设定是否要显示滚动条,YES是要显示滚动条,NO是无论如何都不要显示,AUTO是视情况显示。 
5. noresize
设定不让使用者可以改变这个框框的大小,如果没有设定这个参数,使用者可以很容易的拉动框架,改变其大小。 
6. marginhight=2
表示框架高度部份边缘所保留的空间。 
7. marginwidth=2
表示框架宽度部份边缘所保留的空间。 
【相关用法】 
◆ <noframe> 
1. 使用方法:<noframe>请换有支持Frame功能的浏览器</noframe> 
2. 卷标解说:有些浏览器较为老旧,无法显示Frame的功能,因此,就要使用此卷标,让这些网友知道,该换换浏览器了。或者,你也可以在这卷标中,摆上没有Frame语法的网页卷标,那么,没有支持Frame功能的浏览器,便会自动显示没有Frame语法的网页。 
◆ target=框窗名称 
1. 使用方法:<A HREF=d1-1.htm target=3>显示内容</A> 
2. 卷标解说:常常有一个情况是,我想在框窗 1 的地方按下连结,但是希望他的内容出现在框窗 3 中(请参照上面那个图),那应该如何写呢?就像上面加个 target=框窗名称 就行啦!
◆ target=_top 
1. 使用方法:<A HREF=http://www.wrclub.net target=_top>网人俱乐部</A> 
2. 卷标解说:有时候,在框窗里会连结到别的站,却发现,新连结的这个站,竟然被框窗包住了,不但难看,而且可能会吃上官司说!所以,这时候你必需加入 target=_top这个参数,那么,这个新连到的网站,就会重新占据整个屏幕啦!

转载于:https://www.cnblogs.com/sharpest/p/7903015.html

HTML基础第七讲---框架相关推荐

  1. 小白都能学会的Python基础 第七讲:综合实战3 - 文字识别、人脸识别实战

    1.华小智系列 - Python基础(案例版) <Python基础>目录 第七讲:综合实战3 - 文字识别.人脸识别实战 1.Python图片文字识别(OCR) 2.Python人脸识别( ...

  2. sql计算留存_SQL基础第七讲:关于用户留存率的计算

    最近,好几个小伙伴都拿着关于用户留存的面试题来问我,所以今天单独开一篇文章讲一下留存问题. 首先看一下留存是什么,简单来说,我和你今天在一家超市购物了,明天我来购物了,你没来,那么我就是这个超市的留存 ...

  3. Python基础--第七讲 列表

    1 序列(sequence) 序列是Python中最基本的一种数据结构.序列用于保存一组有序的数据,所有的数据在序列当中都有一个唯一的位置(索引)并且序列中的数据会按照添加的顺序来分配索引 数据结构指 ...

  4. 视觉SLAM十四讲学习笔记-第七讲-视觉里程计-对极几何和对极约束、本质矩阵、基础矩阵

    专栏系列文章如下:  专栏汇总 视觉SLAM十四讲学习笔记-第一讲_goldqiu的博客-CSDN博客 视觉SLAM十四讲学习笔记-第二讲-初识SLAM_goldqiu的博客-CSDN博客 视觉SLA ...

  5. Js与Jq实战:第七讲:jQuery基础

    第七讲:jQuery基础 一.预习笔记 1.jQuery的简述 2.jQuery对象与JS对象 3.jQuery的基本选择器 4.jQuery层次选择器 5.jQuery基本过滤选择器 6.jQuer ...

  6. Java基础知识第二讲:Java开发手册/JVM/集合框架/异常体系/Java反射/语法知识/Java IO

    Java基础知识第二讲(Java编程规范/JVM/集合框架/异常体系/Java反射/语法知识/Java IO/码出高效) 分享在java学习及工作中,常使用的一些基础知识,本文从JVM出发,讲解了JV ...

  7. 2022张宇考研基础30讲 第七讲 零点问题与微分不等式

    文章目录 第七讲 零点问题与微分不等式 零点问题 普通方法 罗尔定理 实系数奇次方程至少一个根 微分不等式 第七讲 零点问题与微分不等式 零点问题 普通方法 罗尔定理 导数方程降n阶,fx多n个根 实 ...

  8. day 65 Django基础一之web框架的本质

    Django基础一之web框架的本质 django第一天 本节目录 一 web框架的本质及自定义web框架 二 模板渲染JinJa2 三 MVC和MTV框架 四 Django的下载安装 五 基于Dja ...

  9. 高翔Slambook第七讲代码解读(特征点提取)

    前言:小白创建了一个微信公众号,主要面向学习视觉的小伙伴,分享一些学习过程中的感受和一些技术文章.公众号里文章也会更新在CSDN中,不过由于工作量较大,会出现一段时间的延时,感兴趣的小伙伴可以关注公众 ...

最新文章

  1. SpringMVC拦截器与异常处理
  2. 【DBA】DBA——数据库管理员
  3. [转]Linux环境下段错误的产生原因及调试方法小结
  4. 3种Java工厂模式深入理解分析
  5. VirtualAllocEx 跨进程读写数据 代码注入
  6. Vue.js入学教程
  7. docker容器资源配额控制
  8. python实现嵌套列表按指定位置元素排序、按子列表长度、子列表之和、绝对值和、最大/最小值排序
  9. 易车网靠谱吗,蛋蛋告诉你
  10. Android布局详解:FrameLayout
  11. Android 关于佳博和汉印蓝牙热敏打印机开发,androidstudio入门教程
  12. //18. 定义一个基类BaseClass,从它派生出类DerivedClass,BaseClass有成员函数fn1()、fn2(),fn1()是虚函数,DerivedClass也有成员函数fn1()
  13. Linux之端口映射
  14. WordPress 前端投稿/编辑插件 DJD Site Post(支持游客和已注册用户)
  15. 第五卷《鏖战雁门(下)》第47章《抉择》
  16. 获取上个月的第一天和最后一天和当前月最后一天
  17. Ubuntu16.04使用sudo add-apt-repository时报错:aptsources.distro.NoDistroTemplateException
  18. MS Castap学习(1)
  19. 51nod1278 相离的圆
  20. python ——word ppt 转pdf

热门文章

  1. try-with-resources语句
  2. Winform开发框架的业务对象统一调用方式
  3. C语言中的itoa和atoi函数的实现
  4. http://weibo.com/cnblogs
  5. 将NetBIOS名称解析为IP地址的常用方法
  6. 5G技术与触觉互联网,一个全新的世界
  7. Struts2 框架搭建问题三
  8. Android与JS混编(js调用android相机扫描二维码)
  9. 关于Sqlite的一个demo
  10. 关于win2003服务器远程断开后自动注销的问题解决