前端学习 -- Html&Css -- 框架集
框架集和内联框架的作用类似,都是用于在一个页面中引入其他的外部的页面,框架集可以同时引入多个页面,而内联框架只能引入一个,在h5标准中,推荐使用框架集,而不使用内联框架。
使用frameset来创建一个框架集,注意frameset不能和body出现在同一个页面中,所以要使用框架集,页面中就不可以使用body标签。
属性:
- rows,指定框架集中的所有的框架,一行一行的排列;
- cols, 指定框架集中的所有的页面,一列一列的排列。
这两个属性frameset必须选择一个,并且需要在属性中指定每一部分所占的大小。
frameset中也可以再嵌套frameset。
frameset和iframe一样,它里边的内容都不会被搜索引擎所检索,所以如果搜索引擎检索到的页面是一个框架页的话,它是不能去判断里边的内容的,使用框架集则意味着页面中不能有自己的内容,只能引入其他的页面,而我们每单独加载一个页面,浏览器都需要重新发送一次请求,引入几个页面就需要发送几次请求,用户的体验比较差,如果非得用建议使用frameset而不使用iframe。
demo:
<!DOCTYPE html>
<html> <head>
<meta charset="UTF-8">
<title></title>
<frameset cols="30% , * , 30%">
<frame src="lesson18.html" />
<frame src="NavigationBar.html" />
<frameset rows="30%,50%,*">
<frame src="RelativePosition.html" />
<frame src="Table.html" />
<frame src="ZindexAndOpacity.html" />
</frameset>
</frameset> </html>
效果:
github地址:https://github.com/soyoungboy/htmlCssStudy/blob/master/HelloHBuilder/frameset.html
刻运行下看看实际效果
前端学习 -- Html&Css -- 框架集的更多相关文章
- 前端学习:CSS的学习总结(图解)
前端学习:CSS的学习总结(图解) CSS代码笔记 CSS简介 css的引入方式和书写规范 CSS选择器 CSS属性 CSS盒子模型 CSS的定位
- Android程序员学WEB前端(5)-HTML(5)-框架集-Sublime
转载请注明出处:http://blog.csdn.net/iwanghang/article/details/76576279 觉得博文有用,请点赞,请评论,请关注,谢谢!~ 框架集: index7. ...
- 2016.01.22 前端学习 HTML/CSS
学习HTML/CSS http://edu.51cto.com/course/course_id-3116.html 明日实践
- 前端学习 之 CSS(三)
九:浮动 浮动是css里面布局最多的一个属性,也是很重要的一个属性. float:表示浮动的意思. 属性值: none: 表示不浮动,默认 left: 表示左浮动 right:表示右浮动 例: htm ...
- 前端学习之CSS
CSS介绍 CSS(Cascading Style Sheet, 层叠样式表)定义如何显示HTML元素, 给HTML设置样式, 让它更加美观. 当浏览器读到一个样式表, 它就会按照这个样式表来对文档进 ...
- 前端学习 -- Html&Css -- 条件Hack 和属性Hack
条件Hack 语法: <!--[if <keywords>? IE <version>?]> HTML代码块 <![endif]--> <keyw ...
- 前端学习笔记——CSS选择器
学习css选择器之前我们先了解下css规则: CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明: 选择器通常是需要改变样式的 HTML 元素. 每条声明由一个属性和一个值组成. 1.id选 ...
- 前端学习 之 CSS(二)
五:继承性和层叠性 css有两大特性,即继承性和层叠性. 1. 继承性 面向对象语言都会存在继承的概念,在面向对象语言中,继承的特点:继承了父类的属性和方法.那么我们现在主要研究css,css就是在设 ...
- 前端学习 之 CSS(一)
一:什么是 CSS? ·CSS 指层叠样式表 (Cascading Style Sheets) ·样式定义如何显示 HTML 元素 ·样式通常存储在样式表中 ·把样式添加到 HTML 4.0 中,是为 ...
随机推荐
- pandas:解决groupby().apply()方法打印两次
对于以下dataframe执行dataframe.groupby(['name', 'course']).apply(lambda x: test(x)) 操作 其中test(x)函数为: def t ...
- 【调试技巧】 Fiddler高级用法之url映射请求
问题场景: 已发布线上APP出现接口错误,如何测试线上APP访问本地请求? 已发布线上H5页面,静态资源或js调试,如何映射本地js? 一般解决方案: 猜测(一般明显问题). 找到原发布包,修改请求资 ...
- CrackMe005-下篇 | 逆向破解分析 | 160个CrackMe(视频+图文)深度解析系列
作者:逆向驿站微信公众号:逆向驿站知乎:逆向驿站 CrackMe005,上篇说了具体方法,下篇来发逆向分析过程,看看老夫是如何得到上篇的具体方法的! 准备 [环境和工具] win7/xp虚拟机环境 C ...
- Openstack部署踩坑
第一周: 使用kola部署Openstack,vip_address有问题,双网上也不行,就是部署不了,但all-in-one却可以,可是节点不会加. 第二周: 使用Packstack部署Openst ...
- nginx try_files 详解
server { listen ; server_name localhost; index index.html index.htm index.php; root /data/wwwroot; l ...
- 1013 C. Photo of The Sky
传送门 [http://codeforces.com/contest/1013/problem/C] 题意 输入一个n代表n颗星星,输入2n个数,其中任意两个数代表一颗行星的坐标,问你把n个星星围起来 ...
- 第三个Sprint冲刺第六天(燃尽图)
- Daily Scrum - 12/15-21
Meeting Minutes 没有什么实质性进展: 添加/完成了一个新feature,即使用非线性的函数作为速度条的设定: 等待与travis开会,讨论下一步的feature = =: 阅读code ...
- Docker Volume
http://www.cnblogs.com/sammyliu/p/5932996.html http://dockone.io/article/128
- WinForm(WPF) splash screen demo with C#
https://www.codeproject.com/Articles/21062/Splash-Screen-Control https://www.codeproject.com/Article ...