使用框架,可以在一个浏览器窗口中显示不止一个页面。
示例
垂直分栏:
这个例子说明了如何创建一个有三个页面的垂直分栏。
水平分栏:
这个例子说明了如何创建一个有三个页面的水平分栏。
如何使用<noframes>标签:
这个例子说明了如何使用<noframes>标签。
在这个页面的底部,还有更多例子。
框架
使用框架,可以在一个浏览器窗口中显示不止一个HTML文档。这样的HTML文档被称为框架页面,它们是相互独立的。
使用框架的不利因素有:
- 网站开发者需要关心更多HTML文档的情况。
- 打印整个页面变得困难。
frameset标签
- <frameset>标签定义了如何将窗口拆分成框架。
- 每个frameset标签定义了一组行和列。
- 行/列的值指明了每个行/列在屏幕上所占的大小。
frame标签
下面这个例子中,有一个两列的分栏。第一个被设置成窗口宽度的25%,第二个被设置成窗口宽度的75%。页面“frame_a.htm”被放在第一个分栏中,“frame_b.htm”被放在第二个分栏中。
<frameset cols="25%,75%"> <frame src="frame_a.htm"> <frame src="frame_b.htm"> </frameset>
基本注意点——有用的技巧
假如一个框架有可见边框,用户可以拖动边框来改变它的大小。如果不想让用户改变大小,可以在<frame>标签中加入:noresize="noresize"。
给不支持框架的浏览器写上<noframes>标签。
更多示例:
混合框架:
这个例子说明了怎样把三个页面以行列混合的方式放在框架中。
使用了noresize="noresize"的框架:
这个例子说明了noresize属性。这个框架是不可改变大小的,把鼠标移动到框架边界上,你会发现无法调整大小。
导航框架:
这个例子说明了如何创建一个导航框架。导航框架包含了一系列链接,它们的目标页面在第二个框架中。文件“frame_links.htm”包含了三个链接,链接的代码如下:
<a href ="frame_a.htm" target ="showframe">Frame a</a> <a href ="frame_b.htm" target ="showframe">Frame b</a> <a href ="frame_c.htm" target ="showframe">Frame c</a>
第二个框架将显示链接到的页面。
内联框架:
这个例子说明了如何创建一个内联框架(包含在HTML页面里的框架)。
在框架内跳转到指定章节:
这个例子显示了两个框架页。其中一个的源是一个文件的指定章节,该章节在文件“frame_section.htm”中使用代码<a name="C10">指定。
使用导航框架跳转到指定章节:
这个例子显示了两个框架页。左边的导航框架包含了一系列以第二个框架为目标的链接(“frame_linksection.htm”),第二个框架显示链接文件(“frame_section.htm”)。导航框架中的一个链接指向目标文件中的指定章节。文件“frame_link”中的HTML代码是像这样的:
<a href ="frame_section" target ="showframe">没有命名锚的链接</a> <a href ="frame_section#C10" target ="showframe">有命名锚的链接</a>
|
相关推荐
WEB开发系列教程,HTML5是新一代开发语言,在WEB项目开发,移动项目开发中必不可少的标记语言,本教程是你进行HTML5学习完整、系统的教材。
ASP.NET MVC框架开发系列课程(20):HTML Helper的使用与扩展
ServiceStack 是一系列事物的综合体:包含高性能 Razor Engine 的 Web 应用框架支持例如 HTML,XML,JSON,SOAP 等多种格式的基于消息的 Web 服务框架包含内建 IOC 的容器若干内建库文件,诸如:Text serializer...
YAML 提供一系列完整的匹配构建模块来创建复杂的网页界面。网格,导航,表格,字体排版模块和所有附件都能进行无缝的协同合作。所有的布局模块都能兼容 HTML5 和 CSS 3,还很容易兼容其他最新的 web 开发技术。 ...
她是所有前端框架中组件库最全的框架之一。并且提供非常详尽的使用文档,目前包含642个章节,涉及框架使用中可能会遇到的方方面面。 QUI 框架是目前所有同类产品中最漂亮的前端框架,拥有上百套美观的、风格各异的...
一款基于HTML5的Web开发和HTML5移动开发的著名框架,其库和内容相当的丰富。是由object-C移植而来的JavaScript版本。 主要功能: 流程控制(Flow control):非常容易地管理不同场景(scenes)之间的流程控制 ...
因此,与现在的一般依赖某个Javscript框架的HTML组件相比,Web组件希望能减少碎片。尽管Web组件是一项有趣的新技术,但在浏览器们都支持它们(并且大部分用户都开始使用这些浏览器们)之前,其中的大部分功能还派不...
在目前的测试环境下,支持IE5及以上版本,Mozilla系列和支持DOM2模型的其他浏览器。你不用再考虑在多浏览器下如何兼容,JSValidation帮你做到了这些。 <br>2. JSValidation能做什么,不能做什么? 如上所述,...
前端html5框架ZUI发布1.2正式版本了! 此版本增加了很多新特性,同时修复问题,文档也得到大幅完善。 欢迎大家使用并反馈问题, 更新明细: 1、新增日历视图组件,方便实现日程的展示 2、新增数据表格视图组件,更...
Vue.js是一套构建用户界面的...聊天室程序则体现了Vue和HTML5技术的整合,而OLTP管理界面应用在很多系统之内,是很常用的案例,里面包括CRUD的操作、数据分页、Ajax等等。通过这些案例,最终强化学生驾驭Vue.js的水平。
神作。。从高通7系列硬件架构,Android Display SW架构,到Android显示系统的C/S架构,SurfaceFlinger系统服务等,详细分析了Android的显示机制。
web渗透系列教学下载共64份: 内容如下; web渗透--1--web安全原则.pdf web渗透--10--不安全的HTTP方法.pdf web渗透--11--登录认证安全测试.pdf web渗透--12--浏览器缓存攻击测试.pdf web渗透--13--目录遍历文件包含...
这是HTML学习总结系列的第二篇,第一篇在这里: HTML 学习总结1入门 基本概念、格式 文字标签 图片标签 链接标签 表格标签 注释 这次的学习内容相较第一次分类少,但是比较杂。 框架集标签 框架标签是将网页设置成...
(1)ASP.NET MVC+EF框架+EasyUI实现权限管理系列(12)-实现用户异步登录和T4模板:...(2)ASP.NET MVC+EF框架+EasyUI实现权限管理系列之开篇:http://www.cnblogs.com/hanyinglong/archive/2013/03/22/2976478.html
DWZ系列开源项目: dwz富客户端框架 - jUI dwz4j(Java Web)快速开发框架 + jUI整合应用 J-HI(Java Web)快速开发平台 + jUI整合应用(Eclipse插件生成项目代码) ThinkPHP2.1 + jUI整合应用 YII + jUI整合应用 常见...
Mobile Angular UI 是个 HTML5 移动端 UI 框架,允许使用 Angular JS 和 Bootstrap 3 来开发移动端应用。 Mobile Angular UI 在 Bootstrap 3 的基础上新增了: switches, overlays, sidebars, scrollable areas, ...
烧瓶和布尔玛模板此代码是后端框架Flask和前端框架Bulma的模板。 它基于YouTuber Corey Schafer的Flask系列。 它还不遵循应用程序工厂模式; 我认为这样更好。 该模板组织良好,分为文件夹和文件,其中包含特定用途...
框架在实战中并不常用,但又很有用。因此用多讲来详解了这一技术点。
html5-练习 一系列练习,将设计转换为HTML5页面以及Angular和ReactJS等框架中的组件