HTML之框架组合网页
框架组合网页
通过前面几章的学习,相信大家已经初略掌握了如何开发一个HTML页面。有时呢,我们可能会需要在一个HTML页面中显示多个页面的内容。要开发这种复杂的页面,我们需要使用框架技术。其可以将多个页面组合在一起,页面的结构可以重用,同时也方便布局。
框架是HTML很早就使用的一种技术。使用框架技术,我们可以达到一下几点优势:
- 在同一个窗口下显示多个页面,能有效地将多个页面组合在一起,但是各个页面间相互独立。
- 可以实现页面的重用。例如将网站的顶部和底部单独作为一个页面,方便其它页面的使用。
- 实现典型的**“目录结构”**,即左侧目录、右侧内容,当用户单击左侧窗口的目录时,在右侧窗口中显示具体内容。
常用的框架技术有这么两类:框架集(frameset),这是早期的框架技术,页面各窗口全部用框架(frame)实现,形成一个框架集。这种结构非常清晰,适用于整个页面都用框架是实现的场合;内嵌框架(iframe),页面中的部分内容用框架实现,通常用于在页面中引用站外的页面内容,使用比较灵活、方便。
一、框架集
在<frameset>
框架下,我们可以将页面分隔为多个区域,每个区域显示不同的网页。修改页面时,也只需修改特定区域的页面即可,无需更新整个框架集中的所有页面。(这就是它的优势)。注意frameset标签会代替body标签。
<frameset cols="25%,50%,*" rows="50%,*" border="5">
这里的cols属性即页面的纵向分隔( * 表示剩余的页面),rows属性则表示横向分隔。在<frameset>
框架的子页面则用<frame>
标签表示。
<frame scr="" name="" scrolling="" noresize="" border="">
scr属性类似于<img>
标签的“src”,表示页面的路径。scrolling属性表示子页面是否显示滚条,noresize属性则表示是否允许调整框架窗口的大小。name属性则可配合target超链接使用。(都是很有用的)
<frameset>
标签下不仅可以放置<frame>
,也可以嵌套自身。即我们不仅可以按行组合框架、按列组合框架,也可以行列混合组合框架。如:
<frameset rows="25%,*" bordercolor="green"><frame src="top.html" name="top"><frameset cols="20%,*" ><frame src="left.html" name="left"/><frame src="right.html" name="right"/></frameset>
</frameset>
效果如下:
二、内嵌框架
iframe内嵌框架适用于将部分框架内嵌到页面的场合,通常用于引用其他网站的页面。使用它时,无需替代<body>
标签。
<iframe src="" name="" frameborder="" scrolling="">
<body><h1 align="center">网站检索</h1><p align="center"><a href="http://www.google.com" target="main">Google-1</a><a href="http://www.google.com" target="main">Google-2</a><a href="http://www.google.com" target="main">Google-3</a></p><center><iframe src="http://www.google.com" name="mian" width="1000px" height="300px" ></iframe></center>
</body>
效果如下:
同志们,至此HTML的一点点内容就结束了,感谢大家的支持!
HTML之框架组合网页相关推荐
- 【转载】我心目中最好的框架组合是
我心目中最好的框架组合是: 表示层:spring mvc 3.1 + annotation 控制层:spring 3.1 持久层:hibernate 3.6 +jdbcTemplate ...
- java ssm框架做增删改查,使用SSM框架组合实现增删改查的功能
基于ssm框架组合的增删改查功能 ssm框架组合之前已经搭建完成了,下面基于该框架组合实现增删改查的功能,首先创建一个数据库和一张表: CREATE DATABASE `ssmteam` /*!401 ...
- 展示一下基于flask框架的网页播放器的代码
<p>下面是基于Flask框架的网页播放器的代码:from flask import Flaskapp = Flask(<strong>name</strong>) ...
- html网页制作浮动框架,浮动框架在网页制作中使用技巧.doc
浮动框架在网页制作中使用技巧 浮动框架在网页制作中使用技巧摘要:首先介绍了浮动框架的应用特点,然后结合实际的使用技巧介绍了在浮动框架中:可以制作与其它页面之间的链接,设置浮动框架的滚动条及区域的颜色, ...
- frame框架设计网页
如何用框架设计网页 如图 首先设计一个两列的框架结构的网页 Frame.html 框架的结构 <frameset cols="250, 750" frameborder=&q ...
- 如何利用Visual Studio建立具有MVC框架的网页模型
如何利用Visual Studio建立具有MVC框架的网页模型 1.打开VS2015,新建项目,选择Web模型中的ASP.NET Web应用程序 2.其次选择带有MVC的模板进行创建,并等待项目创建成 ...
- 轻量纯css框架,27款经典的CSS框架小结 网页制作必备
下面给你推荐了27款优秀的CSS框架,你可以选用. 960 像素的页面宽度似乎成为了一种设计标准,在当前各种分辨率下,能够很好地展现网页内容.提供较为常用的尺寸来简化网页设计过程,使工作简单高效. 芒 ...
- 易语言获取html源码,易语言穿透所有框架取网页元素源码
yuanma 找视频-穿透10纵个框架 无模块,.版本 2 .子程序 网页关键字查找, 整数型 .参数 网页对象, 对象 .参数 关键字, 文本型 .局部变量 oDocument, 对象, , , 网 ...
- 用bootstrap框架制作网页
课程设计要做一个html网页,自己做的css样式实在是不堪入目,所以用了bootstrap框架,现总结如下: (1):下载bootstrap: 点击下载后: 下载解压后得到如下文件: (2):将这个文 ...
最新文章
- Go 语言编程 — panic 和 recover
- 通过组策略禁止用户安装任何软件
- 线段树——区间离散化/压缩
- 使用Mapreduce案例编写用于统计文本中单词出现的次数的案例、mapreduce本地运行等,Combiner使用及其相关的知识,流量统计案例和流量总和以及流量排序案例,自定义Partitioner
- 排查链接是否失效_如何进行移动站点流量排查?
- python selenium api_Selenium2+python自动化-查看selenium API
- springmvc视图解析器_SpringMVC视图及REST风格
- 三元表达式三个条件判断
- 【错误信息】Maximum call stack size exceeded
- html5网页制作代码 大学生网页制作作业代码 (旅游网站官网滚动模板)
- html caption属性的值,HTML中的caption属性是什么意思?caption标签在HTML中
- 参加百度深度学习培训总结
- 华为nova8pro鸿蒙系统怎么看,华为nova8的隐藏功能_华为nova8隐藏功能怎么开启
- 必须要了解股权设计的四大核心
- Windows Server 2016 基本设置
- php获取当前周的起止日期,使用PHP实现获取周的起始和结束日期
- msys2 安装笔记
- (转)58同城上市背后:分类信息网站集体转型艰难
- 一个懒惰的人的自省书——请朋友们以我为戒,有更好的未来
- SIGIR2021的5篇论文
热门文章
- fifaonline3服务器位置,fifaonline3 无法解析服务器发送的参数是怎么回事?
- Python turtle库改变海龟速度的几种方法
- [学习PCL]统计滤波(离群点剔除)
- Android Studio 默认配置路径修改
- 回收站有html文件,如何恢复从资源回收站中清理掉的文件
- 关于大数据,这10个有趣事实你很可能不知道
- 购物车模块实现(类比京东和天猫)
- lastpass更改账号注册的邮箱
- C# Thread Delegate MethodInvoker Invoke BeginInvoke 关系
- itemCF matlab算法,基于物品的协同过滤算法(ItemCF)