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效果图

H5学习之旅-H5的框架(13)的更多相关文章

  1. H5学习之旅-H5的基本标签(2)

    H5的标签和html的标签没什么区别,主要介绍H5的基本标签 1.基础标签header和body,header的<title>元素主要是显示在标签页面里面,以及设置使用的语言和编码格式.b ...

  2. H5学习之旅-H5的新特性(1)

    随着H5的发展,网页开发呈现了跨平台的特性,目前H5是兼容各大平台的,这也为一些其他的技术的跨平台开发提供了基础,所以我预测后H5会成为很重要的开发语言 新特性介绍 1.用于回话的canvas标签 2 ...

  3. H5学习之旅-H5列表(8)

    列表的基本语法 ol:有序列表 ul:无序列表 li:列表项 dl:列表 dt:列表项 dd:列表描述 常用列表 1.无序列表:使用标签 ul,li 属性:disc(默认实心圆) circle (空心 ...

  4. H5 学习之旅-H5表格(7)

    表格语法 table:简历表格 captian:表格标题 th:表格行表头 tr:表格行 td:单元格 thead:表格页眉 tfoot:表格页脚 tbody:表格主体 col:列属性 !!!代码实例 ...

  5. H5学习之旅-H5的超链接以及图片链接(6)

    链接内容 1.文本链接 2.图片链接 属性 href:指向另一个文档的链接 name:文档内部的链接 img标签属性 alt:替换文本属性 width:宽 height:高 代码实例 <!DOC ...

  6. H5学习之旅-H5的样式(5)

    样式的引入方式 外部样式表 link rel = "stylesheet" type = "text/css" href = "mystyle.css ...

  7. H5学习之旅-H5的格式化(4)

    H5的格式设置: b代表是粗体 i斜体 big 字体变大 small变小 em强调 strong 加强和变粗差不多 sub 定义下标字 sup 定义上标字 ins 插入字 del 删除字 代码实例 & ...

  8. H5学习之旅-H5与Php交互(12)

    1.首先介绍PHP开发环境的搭建 ,在Google搜apachefriends,会有xampp的下载链接,这个工具集成了apache的很多服务 2.搭建php的编辑环境,选取eclipse安装php插 ...

  9. H5学习之旅-H5的表单(11)

    H5的表单元素 form:表单 input:输入域,type属性可以设置text,password,button等不同的属性 textarea:文本域 lable:控制标签 fieldset:定义域 ...

随机推荐

  1. python笔记十二(匿名函数)

    一.匿名函数 有些情况下,我们需要把函数当做参数传入到另外的函数中,或者是把函数作为某个函数的返回值,此时我们就可以使用匿名函数. 匿名函数的标志是lambda.   >>> f = ...

  2. Gleb And Pizza CodeForces - 842B

    CodeForces - 842B #include<bits/stdc++.h> using namespace std; int main() { int r,d,t; double ...

  3. MongoDB 原子操作

    mongodb不支持事务,所以,在你的项目中应用时,要注意这点.无论什么设计,都不要要求mongodb保证数据的完整性. 但是mongodb提供了许多原子操作,比如文档的保存,修改,删除等,都是原子操 ...

  4. Docker多台物理主机之间的容器互联

    Docker 默认的桥接网卡是 docker0.它只会在本机桥接所有的容器网卡,举例来说容器的虚拟网卡在主机上看一般叫做 veth* 而 Docker 只是把所有这些网卡桥接在一起,如下: [root ...

  5. Mybatis 批量插入、批量更新

            合理的使用批量插入.更新对性能优化有很大的作用,速度明显快了N倍.         要注意数据库连接串后面要新增:&allowMultiQueries=true,表示一个sql ...

  6. Linux Mint 17一周使用体验

    1 Win7下安装Mint双系统 Linux Mint支持直接从Win7硬盘引导安装,非常方便,不用制作U盘引导,更不用刻盘安装了.Mint有Cinnamon和Mate两种桌面,听说Mate更加简洁节 ...

  7. 计算机网络之动态主机配置协议DHCP

    为了将软件协议做成通用的和便于移植,协议软件的编写者不会把所有细节都固定在源代码中,而是把协议软件参数化,这就使得在很多台计算机上使用同一个经过编译的二进制代码成为可能. 一台计算机和另一台计算机的区 ...

  8. hexo常用命令

    Hexo 约有二十个命令,但普通用户经常使用的只有下列几个: hexo s hexo s是hexo server的缩写,命令效果一致:启动本地服务器,用于预览主题.默认地址: http://local ...

  9. 24 服务AIDL

    AIDL远程访问服务的方法 创建一个接口类写上方法 然后修改后缀java为aidl 在服务中创建一个类继承Stub类 在远程访问服务的进程把AIDL文件复制(包名不能改变) XXXX.Stub.asI ...

  10. 【安卓开发】为什么不能往Android的Application对象里存储数据

    在一个App里面总有一些数据需要在多个地方用到.这些数据可能是一个 session token,一次费时计算的结果等.通常为了避免activity之间传递对象的开销 ,这些数据一般都会保存到持久化存储 ...