有a,b,c三个页面,a页面包含b页面,b页面包含c页面.a页面随着b页面自适应,c页面随着b页面自适应
a页面
代码如下:
<body>
<iframe id=main name=main width=980 scrolling=no frameborder=0 src=b页面
onload=this.height=main.document.body.scrollheight;this.width=main.document.body.scrollwidth ;if(this.height < 410){this.height=410;}>
</iframe>
</body>
b页面
代码如下:
<body>
<!--左边-->
<div style=flost:left;>
左边菜单
</div>
<!--右边-->
<div style=flost:right;>
<iframe id=testiframe name=testiframe frameborder=0 style=width: 680px; scrolling=no src=c页面></iframe>
</div>
</body>
c页面
将下面这个js函数写到最最底层的页面中(即最孙子的那个页面) 并在body的onload 事件中调用该方法【下面这个公式是万能公式】
代码如下:
<script type=text/javascript>
//进行iframe的自动撑开,让所有父页面的iframe都自动适应包含页高度
function autoheight(){
var doc = document,
p = window;
while(p = p.parent){
var frames = p.frames,
frame,
i = 0;
while(frame = frames[i++]){
if(frame.document == doc){
frame.frameelement.style.height = doc.body.scrollheight + 'px'; // 这里一定要注意火狐必须要加'px‘否则火狐无效
doc = p.document;
break;
}
}
if(p == top){
break;
}
}
}
</script>
<body onload=autoheight();>
<!--经测试这个最最最子的页面的body中必须要有一个有高度的div才行否则上面的自适应生效-->
<div style=height: 1px;>
</div>
<div style=padding-bottom: 10px;> <!--这句话也是必不可少的-->
这里可以写真正的内容并且给该div的padding-bottom设一个值
</div>
</body>
CSS表单设计 文章出处：https://www.doczj.com/doc/9113956653.html, 今天我们开始学习《十天学会web标准(div+css)》的css表单设计，包含以下内容和知识点： 改变文本框和文本域样式 用图片美化按钮 改变下拉列表样式 用label标签提升用户体验 一、改变文本框和文本域样式 如果前边几章学习的比较扎实的话，本节教程就相当容易了。下边先说一下文本框，文本框和文本域都是可以用css进行美化的。比如改变边框精细，颜色，添加背景色、背景图像等。请看下边的实例： .text1 { border:1px solid #f60; color:#03C;} .text2 { border:2px solid #390; width:200px; height:24px; font-size:16px; font-weight:bold; line-height:1.6;} .text3 { border:2px solid #C3C; height:20px; background:url(icon9.gif) right 3px no-repeat;} .text4 { border:2px solid #F60; width:150px; height:29px;font-size:16px; line-height:1.6; background:url(bg_9.gif) 0 0 no-repeat;} 这四个样式表分别对应第2、3、4、5行表单，第一行是文本框的默认样式；第二行为设置边框和字体颜色的样式；第三行为设置边框、宽度、高度、字体大小、行高的样式；第四行设置边框和增加背景色和背景图片；第五行为增加一个gif动画的背景图片，看起来是不是生动许多，具体步骤不再赘述。下面我们看一下文本域的样式设置： .area { border:1px solid #F90; overflow:auto; background:#fff url(bg_9_1.gif) right bottom no-repeat; width:99%; height:100px;} 上图中第一个为默认的文本域样式，第二个为设置边框、宽度为百分比、高度和景图片。overflow:auto定义当内容不超过现在文本域高度时不出现滚动条。好了，下面运行一下代码看看两者的效果吧
让iframe自适应大小解决方案 第一种： 例子： 1，创建页面test.html 。页面中含有一个iframe，name为ifrname ，id为ifrid，src 为iframe.html 页面。 2，创建iframe.html 页面，里面含有一些内容。 这是iframe页面，通过在父窗口页面或子页面添加JS来自动更改宽高，以适应内容的多少。 要想使iframe自动适应宽和高，可以在test.html 页面iframe onload处增加一些JS代码。如： 这样iframe即可以自动适应高度了。如果不在onload处增加js，那也可以放到页面上来调用。比如写个函数。 这样也可以达到自适应高宽的目的，在这里要注意的是，iframeElement参数必须是 document.getElementById("iframeid")，iframeWindow参数是window.frames[0] 或 document.frames["ifrname"]。这是因为通过name得到的对象是窗口(window)对象，非窗口里的iframe 对象。同时document.getElementById("iframeid)不能像window对象可以得到window.document。 所以这里最好给iframe分别加上name和id，id用来更改宽高样式属性，name用来执行window相关事件如location.href，document.write。bgColor例外，元素对象和窗口对象都可以得到，这是因为他们都有这个属性。
fancyBox 中文文档 fancyBox 为您的网页提供惊艳的缩放功能，同时支持图片、网页内容以及各种多媒体文件。 她基于目前最流行的jQuery 框架开发，不仅易于应用，而且可以定制。欢迎来到fancyBox 的世界~ ?更新日志 ?快速入门 ?常见用法 ?官方演示 ?使用许可&下载地址 ?完整API ?常见问题 更新日志 重大变更 ?可扩展的幻灯片导航工具 ?响应式（调整浏览器窗口大小时自适应窗口大小） ?集成幻灯片图片播放功能
?新增幻灯片过渡效果 ?引入CSS3阴影、圆角特效 ?新的插件选项（与之前版本不兼容） ?改用知识共享署名-非商业性使用3.0许可协议授权 即将上线 ?WordPress小插件 ?重构本站及API文档 ?完善缩略图浏览工具 ?fancyBox 手机版（待定） ?fancyBox 3.0 ↑回顶部 快速入门 1. 下载fancyBox，解压后根据需要将文件复制到网页文件夹中（建议不要更 改目录结构），并在网页源码中引入相应的css 样式和js 文件（如果更改了目录结构，引入的时候请调整相应代码，对应它们所在的路径）。 注意：别忘了还要先加载jQuery 库！推荐使用公共库：百度 | 新浪。示例代码： < !-- 引入 mousewheel 插件（可选，如果想通过鼠标滚轮控制图片播放则必须） --> 2. 给触发fancyBox 特效的元素（如一张缩略图或“点击我”三个字）加上a 链接，并将其href 属性值设置为遮罩层中需要展示的文件的链接（如刚刚那张缩略图的原图的网址）。示例代码： 
3. 使页面加载完毕时初始化fancybox() 函数。如果你不懂jQuery但英语还行，请看官方推荐的新手教程。英语不好肿么办？请点右上角的红叉...因为暂时找不到中文版的帮助文档。示例代码：
iframe的详细用法 IFRAME 元素| iframe 对象 -------------------------------------------------------------------------------- 创建内嵌浮动框架。 成员表 下面的表格列出了iframe 对象引出的成员。请单击左侧的标签来选择你想要查看的成员类型。 标签属性/属性 SHOW: 标签属性/属性 行为 集合 事件 滤镜 方法 对象 样式 标签属性属性描述 ALIGN align 设置或获取表格排列。 ALLOWTRANSPARENCY allowTransparency 设置或获取对象是否可为透明。APPLICATION APPLICATION 表明对象的内容是否为HTML 应用程序(HTA)，以便免除浏览器安全模式。 ATOMICSELECTION 指定元素及其内容是否可以一不可见单位统一选择。 BEGIN begin 设置或获取时间线在该元素上播放前的延迟时间。 BORDER border 设置或获取框架间的空间，包括3D 边框。 canHaveChildren 获取表明对象是否可以包含子对象的值。 canHaveHTML 获取表明对象是否可以包含丰富的HTML 标签的值。 CLASS className 设置或获取对象的类。 contentWindow 获取指定的frame 或iframe 的window 对象。 DATAFLD dataFld 设置或获取由dataSrc 属性指定的绑定到指定对象的给定数据源的字段。 DATASRC dataSrc 设置或获取用于数据绑定的数据源。 disabled 获取表明用户是否可与该对象交互的值。 END end 设置或获取表明元素结束时间的值，或者元素设置为重复的简单持续终止时间。firstChild 获取对象的childNodes 集合的第一个子对象的引用。
竭诚为您提供优质文档/双击可除 html5,布局,模板 篇一：干货!全新的免费html5网页模版 干货！全新的免费html5网页模版 目前互联网上存在很多专业的高质量html5模版，并且是免费的，如果你熟悉编程的话，只需要研究一下它们的代码就可以学到很多便捷的操作和新的技术。在今天的文章当中我不是列出一长串可用模版的列表，而是精挑细选出高质量的响应式html5模版。更重要的是，它们都是免费的，所以我希望能有几个模版能满足的你的需求，能够运用于你的项目当中。 codester legend legend是一个基于twitterbootstrap的多功能响应式 单页模版。你可以用它来制作一个登录页，或者说是创意设计人员的线上作品展示网站，甚至于是构建一个商务主题站。 caprice liquidgem liquidgem利用css媒体查询和百分比布局给出了一个
完整的响应式设计。它还包括一个图片幻灯，一套完整的php 联系表单和一个工作示例页面。 mnml 一个轻量级的模版，用于html5/scss的响应式项目。 Varna 免费，开源，极简的响应式网站模版。 agency agency是基于twitterbootstrap建立的响应式html5商务模版。 century 拥有工作分类和音乐播放器的响应式html5模版。 mori-dark 极其简约的响应式博客模板。 篇二：html5网站布局 不带边框的iframe因为能和网页无缝的结合从而不刷新页面的情况下更新页面的部分数据成为可能，可是iframe 的大小却不像层那样可以“伸缩自如”，所以带来了使用上的麻烦，给iframe设置高度的时候多了也不好，少了更是不行，现在，让我来告诉大家一种iframe动态调整高度的方法，主要是以下js函数： 一、程序代码 functionsetwinheight(obj)
html特效代码大全精美免费下载.txt每天早上起床都要看一遍“福布斯”富翁排行榜，如果上面没有我的名字，我就去上班。谈钱不伤感情，谈感情最他妈伤钱。我诅咒你一辈子买方便面没有调料包。 HTML代码大全免费下载 HTML特效代码1。忽视右键
或 2。加入背景音乐 IE:如何在数据可视化FineBI的web页面集成URL 1 直接使用URL链节 将该URL复制粘到某一节点上即可，在该节点上通过URL访问FineBI的服务器，登录FineBI服务器后即可查看该报表。这样就在其他系统平台上查看分析模板了。实际上与上一节各部分URL介绍中的“效果查看”是一致的。 注：因为分析模板自身就是一个纯HTML5页面，因此使用这个URL可以直接集成到微信上。 注：BI的分析模板都必须登录FineBI的服务器才可以访问，因此要满足两个条件：1、FineBI服务器是开启状态；2、登录验证通过服务器并有查看的权限（单点登录就是自动登录BI服务器来实现无缝集成。） 注：除了单点登录的方式，URL本身也可以自己传一个用户名和密码进行。 2 iframe框架集成 当用户在开发环境下，要控制分析模板所展现的位置，展现的大小，可以使用iframe 的集成方式把FineBI当作页面的一部分，以iFrame方式嵌入在网页中，指定iFrame的src即可。其写法如下; 1.
在iframe的框架嵌入时，BI的分析模板会出现双滚动条的情况，可以通过修改iframe语句来调整去掉横向滚动条。 注:FineBI的分析模板依据当前通用的浏览器页面设置，默认的是横向自适应，保留了纵向的滚动条。 1.
html + css + js 桌面exe--c/s web 应用程序---b/s Internet 与web 的关系 提供了多种服务:WWW/FTP/Telnet/Email/... web 只是internet 提供的其中一种服务 web 结构:一问一答browser: 发送请求/ 解释显示页面server:得至U请求/响应请求通信协议:HTTP--超文本传输协议 主流browser:IE/Firefox/Chrome/Sarifa/Opera W3C:99 4.01--XHTML 超文本:用HTML 语言编写的后缀为.html 或者.htm 的文件（网页） web 开发的技术: 客户端技术:html+css+js 服务器端技术:jsp/php/aspx html（标记语言）的基本语法: 对标记括起来文本,由浏览器显示<元素> <元素属性1="属性的值" 属性2="属性的值"> <元素> 空标记
html 文档的结构
Iframe用法的详细讲解 今天我们来学习Iframe 用法的详细讲解，快来一起学习吧。下面就和大家分享，来欣赏一下吧。 Iframe 用法的详细讲解 Iframe用法的详细讲解 把iframe解释成“浏览器中的浏览器“很是恰当 设定围绕图文框的边缘宽度 FRAMEBODER 设置边框是不否为3维(0=否，1=是) HEIGHT,WIDTH 设质边框的宽度和高度 SCROLLING 是否有滚动条(YES,NO,AUTO) SRC 指定IFRAME调用的文件或图片(HTML,HTM,GIF,JPEG,JPG,PNG,TXT IFRAME 元素| iframe 对象 创建内嵌浮动框架。 成员表 下面的表格列出了iframe 对象引出的成员。请单击左侧的标签来选择你想要查看的成员类型。 标签属性/属性
SHOW: 标签属性/属性 行为 集合 事件 滤镜 方法 对象 样式 标签属性属性描述 ALIGN align 设置或获取表格排列。 ALLOWTRANSPARENCY allowTransparency 设置或获取对象是否可为透明。 APPLICATION APPLICATION 表明对象的内容是否为HTML 应用程序(HTA)，以便免除浏览器安全模式。 ATOMICSELECTION 指定元素及其内容是否可以一不可见单位统一选择。 BEGIN begin 设置或获取时间线在该元素上播放前的延迟时间。 BORDER border 设置或获取框架间的空间，包括3D 边框。 canHaveChildren 获取表明对象是否可以包含子对象的值。 canHaveHTML 获取表明对象是否可以包含丰富的HTML 标签的值。