IT兄弟连 HTML5教程 HTML5文字版面和编辑标签 HTML框架结构
ccwgpt 2024-10-25 10:42 32 浏览 0 评论
使用HTML框架结构可以把一个浏览器窗口划分为若干个小窗口，每个窗口可以显示不同的URL网页，每个框架里的网页相互独立。这样不仅可以非常方便地在浏览器中同时浏览不同的页面效果，而且可以非常方便地完成导航工作。如果所有的框架标记要放在一个HTML文档中，这个HTML页面的文档体标签<body>被框架集标签<frameset>取代，然后通过<frameset>的子窗口标签<frame>定义每一个子窗口和子窗口的页面属性，子窗口的排列遵循从左到右、从上到下的次序规则。
1．划分框架
使用<frameset>标签决定如何划分框架，该标签中有cols属性和rows属性。使用cols属性表示按列分布框架，使用rows属性表示按行分布框架。必须使用<frame>标签设定每个小窗口中的网页，该标签里有src属性为每个URL值指定一个HTML文件（这个文件必须事先做好）地址，地址路径可以使用绝对路径或相对路径，这个文件将载入相应的窗口中。如果希望在同一个浏览器窗口中，将其既按照行来分布框架，又按照列来分布框架，可以将<frameset>标签嵌套使用形成嵌套框架。<frameset>标签常用的属性如表6所示。
表6 HTML的<frameset>标签常用的属性
2．子窗口<frame>标签的设定
<frame>是一个单标签，该标签必须放在框架集<frameset>中使用。<frameset>设置了几个子窗口，就必须对应几个<frame>标签，而且每一个<frame>标签内还必须使用src属性设定一个网页文件。其常用属性如表7所示。
表7 HTML的<frame>标签常用的属性
3．窗口的名称和链接
如果要在窗口中做链接，就必须对每一个子窗口命名，以便被用于窗口间的链接。在窗口的链接中使用target属性，就可以将被链接的内容放置到想要放置的窗口内。在下面的例子中，通过框架技术并使用窗口的名称和链接实现后台首页模型，如图6所示：
图3.6 HTML的框架集标签演示结果
在图6提供的网站后台管理平台界面模型中，当单击大类管理选项时改变左边菜单中的页面，当单击左边的菜单链接时改变右边主体页面的内容。在文件index.html中划分框架的代码如下所示：
主窗体文件index.html
在上面的示例代码中，先将窗体分为上下两行，并将顶部窗体命名为top，设置80像素高度。然后将下部的窗体分为左右两个窗体，分别设置为200像素和使用“*”表示剩余部分，并分别命名为menu和main。网页文件index.html的文档体标签<body>被框架集标签<frameset>取代，所以不能在这个框架文件中再有<body>的内容。然后通过<frameset>的子窗口标签<frame>定义每一个子窗口，并通过子窗口的属性src分别加载top.html、menu.html和main.html 3个页面文件。这3个页面文件的源代码如下所示：
顶部设置大类选项窗体文件top.html
左边设置菜单选项窗体文件menu.html
右边设置内容窗体文件main.html
在top.html文件的每个链接中，通过target属性设置左边菜单窗体名称menu，当单击大类管理选项时，链接文件就会在左边窗体中显示。同样，在menu.html文件的每个链接中，通过target属性设置右边窗体的名称main，当操作每个菜单选项时，对应的链接文件就会在名为main的窗体中加载。当然，在本例中还需要为每个大类管理选项定义一个独立的菜单页面，也需要为每个菜单项定义唯一的内容页面。
相关推荐
- 丨公司丨公司大架构整理汇总
-
注：本文转自团队成员原创作品，特此鸣谢（公号：法海图鉴）今日话题公司大架构整理背景介绍经过前几期话题对各种企业类型的介绍，想必大家已经有了初步认识。之后我将带着大家开启对公司的深入了解。本期...
- 图解物理--八年级物理下册最全知识框架导图
-
第七章力1力2弹力3重力第八章运动和力1牛顿第一定律2二力平衡3摩擦力第九章压强1压强2液体压强3大气压强4流体压强与流速的关系第十章浮力1浮力2阿基米德原理3物体的浮沉条件及应用第十一章功...
- 八年级上册生物，思维导图，期末高分必备资料，家长收藏
-
这是八年级上册生物的思维导图，孩子在背诵知识点的时候，可以看一下知识点在导图中的位置，形成对知识点整体的把握，有助于学生拿高分，特别是图片中带红色星星的部分，更是要注意背诵，是重点内容。家长可以把图片...
- 2019政府工作报告精华，这张思维导图里全都有
-
每经记者：李可愚每经编辑：陈星每日经济新闻
- 图解薪酬体系结构设计
-
...
- 司考复习独家总结!一张图总结行政法知识结构体系
-
作为三大实体法之一，行政法的分值在60分左右，行政法在司法考试中一直比较平稳常规，没有偏题怪题，还是比较容易得分的。小编要提醒大家，在3月之前要把三大实体法学习一遍。下图是厚大在线360导学师小周总结...
- 实用干货!高中物理框架图，让零碎知识“串联”起来
-
高中物理学习一定要抓好逻辑结构大框架！了解整个知识框架体系后，更易抓住骨干知识，干掉重难知识点~今天给大家分享高中物理的框架图同学们赶紧收藏起来吧！力学知识结构图光学知识结构图热学、原子物理知识结构图...
- 254m超高层办公楼型钢砼框架-核心筒结构图
-
高度类别：超高层建筑钢筋混凝土结构：框架,框架核心筒钢结构：钢框架建筑功能：办公包含：办公楼57层（-3层）254.150m钻孔灌注桩桩+筏板型钢混凝土框架-钢筋混凝土核心筒西裙房2层（-...
- 砖混结构与框架结构，究竟有何区别?千万别被坑!
-
现在买房装修的人最怕啥？不是价格高，而是房子不安全！两种主流建筑结构，砖混靠墙，框架靠柱子，选错了隔墙都可能要命。简单说，砖混便宜但别碰高层，框架贵点但能保命。砖混那些承重墙根本不能拆，想砸墙改个开放...
- 大师一百——高中化学必考:《元素周期律》考点框架图
-
今天大师给大家带来的是高中化学的《元素周期律》考点框架图，高中的同学必须牢记于心，这种重要的考点，考试是一定会考的！化学大师...
- 需求分析框架图
-
需求分析框架图
欢迎 你 发表评论:
- 一周热门
- 最近发表
- 标签列表
-
- 框架图 (58)
- flask框架 (53)
- quartz框架 (51)
- abp框架 (47)
- jpa框架 (47)
- springmvc框架 (49)
- 分布式事务框架 (65)
- scrapy框架 (56)
- shiro框架 (61)
- 定时任务框架 (56)
- java日志框架 (61)
- JAVA集合框架 (47)
- mfc框架 (52)
- abb框架断路器 (48)
- beego框架 (52)
- java框架spring (58)
- grpc框架 (65)
- tornado框架 (48)
- 前端框架bootstrap (54)
- orm框架有哪些 (51)
- ppt框架 (48)
- 内联框架 (52)
- cad怎么画框架 (58)
- ssm框架实现登录注册 (49)
- oracle字符串长度 (48)