H5学习之旅-H5的框架(13)
2015-09-21 15:38
316 查看
H5框架语法介绍 :frame:框架对于页面的设计有很大的作用 frameSet:框架集标签定义如何将窗口分割为框架 ,每一个frameset定义一些列行或者列,rowS/COLS规定了每行或者每列占据屏幕的面积 noresize:固定框架大小 cols:行比例 rows:列比例 iframe:内联框架
代码实例:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>H5表格提交</title> </head> <frameset cols="20%,50%,30%"> <frame src="framea.html"> <frame src="frameb.html"> <frame src="framec.html"> </frameset> </html>
!!!!!效果图
!!!!!!上面的两个标签都过时了,下面介绍内联标签iframe
使用了index,和framec,frameb,以及framea,层层以iframe的形式来嵌套,并且演示了a标签的target属性,parent,表示在上一个嵌套父控件中打开以及top表示在最顶部的控件中打开
index代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>H5表格提交</title> </head> index <iframe src="framec.html" width="800px" height="800px"></iframe> </html>
framec代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> </head> <body bgcolor="#ffd700"> framec <br/> <iframe src="frameb.html" width="600px" height="600px" ></iframe> </body> </html>
frameb代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> </head> <body bgcolor="black"> frameB <br/> <iframe src="framea.html" width="400px" height="400px"></iframe> </body> </html>
framea代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> </head> <body bgcolor="#ff1493"> frameA <a href="http://wwww.baidu.com" target="_self">百度一下</a> </body> </html>
self效果图
parent效果图
相关文章推荐
- 利用HTML5实现使用按钮控制背景音乐开关
- adt 支持html5
- 小强的HTML5移动开发之路(5)——制作一个漂亮的视频播放器
- 小强的HTML5移动开发之路(5)——制作一个漂亮的视频播放器
- 小强的HTML5移动开发之路(5)——制作一个漂亮的视频播放器
- 努力学习 HTML5 (2)—— 元素的增和删
- 让老版本IE支持HTML5
- 小强的HTML5移动开发之路(4)——CSS2和CSS3
- 小强的HTML5移动开发之路(4)——CSS2和CSS3
- 小强的HTML5移动开发之路(4)——CSS2和CSS3
- HTML5 移动开发入门知识点
- HTML5 移动开发入门知识点
- HTML5 移动开发入门知识点
- 小强的HTML5移动开发之路(3)——HTML5与HTML4比较
- 小强的HTML5移动开发之路(3)——HTML5与HTML4比较
- 小强的HTML5移动开发之路(3)——HTML5与HTML4比较
- first H5
- 小强的HTML5移动开发之路(2)——HTML5的新特性
- 小强的HTML5移动开发之路(2)——HTML5的新特性
- 小强的HTML5移动开发之路(2)——HTML5的新特性