给 iframe 元素设置 fixed 定位，并且设置 100% 的宽和高：

iframe {

    position: fixed;

    background: #000;

    border: none;

    top:; right:;

    bottom:; left:;

    width: 100%;

    height: 100%;

}

参考链接：javascript - Full-screen iframe with a height of 100% - Stack Overflow

iframe 设置占屏幕高度 100%的更多相关文章

  1. css设置自适应屏幕高度

    <style type="text/css"> body,html{ margin:0; height:100%; /*这里将高度设置为100%是这个布局实现自适应高度 ...

  2. 使用iframe设置frameset的高度

    index.html的页面代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "htt ...

  3. 设置iframe高度自适应屏幕高度

    写在前面: 最近在搭建项目前台页面框子的时候,把iframe设置成了固定的高度,导致不同的电脑尺寸访问的时候,高度差异较大,故查了下,将iframe设置成自动适应屏幕高度的方式,这里记录下. 还是直接 ...

  4. 网页或微信小程序中使元素占满整个屏幕高度

    在项目中经常要用到一个容器元素占满屏幕高度和宽度,然后再在这个容器元素里放置其他元素. 宽度很简单就是width:100% 但是高度呢,我们知道的是height:100%必须是在父元素的高度给定了的情 ...

  5. 获取iframe子页面内容高度给iframe动态设置高度

    <!DOCTYPE html><html> <head> <meta charset="UTF-8" /> <meta nam ...

  6. (转)iframe 高度100%时，出现垂直滚动条

    问题 需求是这样的,iframe在一个div中,并且iframe高度与div一样,所以设置了iframe高度是100%,结果div出现了滚动条,在排除了padding.margin的因素外,还是有滚动 ...

  7. 父容器根据子容器高度自适应：设置父容器 height:100%;overflow:hidden;

    父容器根据子容器高度自适应:设置父容器  height:100%;overflow:hidden;

  8. js不需要知道图片宽高的懒加载方法（经过实际测试，不加宽高仍然是无法正常加载的，设置height:auto,height:100%，仍然显示高度为0）

    js不需要知道图片宽高的懒加载方法 懒加载是如何实现的? - 简书https://www.jianshu.com/p/e86c61468285找到一个不需要知道图片宽高的懒加载方法了(经过实际测试,不 ...

  9. 【CSS系列】height:100%设置div的高度

    一.div设置百分百高度实现描述 在html布局中body内第一个div盒子对象设置100%高度height样式,是无法成功显示100%高度的.这个是因为body高度默认值为自适应的,所以及时设置bo ...

随机推荐

  1. CodeForces 780 E Underground Lab

    Underground Lab 题解: 如果遍历一棵树,我们可以发现最多需要走的步数也不会超过2 * n步. 所以我们选出一棵树,然后遍历一边这颗树. 然后把序列分成k块就好了. 代码: #inclu ...

  2. Atcoder D - Widespread （二分）

    题目链接:http://abc063.contest.atcoder.jp/tasks/arc075_b 题解:直接二分答案然后再判断(a-b)来替代不足的.看代码比较好理解,水题. #include ...

  3. codeforces 284 C. Cows and Sequence（线段树）

    题目链接:http://codeforces.com/contest/284/problem/C 题意:就是给出3个操作 1)是将前i 个数加x 2)在数组最后添加一个数x 3)删除数组最后的那个数 ...

  4. 3. Sentinel源码分析— QPS流量控制是如何实现的？

    Sentinel源码解析系列: 1.Sentinel源码分析-FlowRuleManager加载规则做了什么? 2. Sentinel源码分析-Sentinel是如何进行流量统计的? 上回我们用基于并 ...

  5. IDEA 中用好 Lombok，撸码效率至少提升5倍！

    来 源:http://t.cn/EXhxRzV 以前的Java项目中,充斥着太多不友好的代码:POJO的getter/setter/toString:异常处理:I/O流的关闭操作等等,这些样板代码既没 ...

  6. kafka入门配置

    问题导读: 1.zookeeper在kafka的作用是什么? 2.kafka中几乎不允许对消息进行“随机读写”的原因是什么? 3.kafka集群consumer和producer状态信息是如何保存的? ...

  7. 字节输出流OutputStream

    1.OutputStream是输出字节流的超类. import java.io.File; import java.io.FileOutputStream; import java.io.IOExce ...

  8. 过渡 - transition

    过渡 - transition 是变形transfrom其中一种效果,定义为一种状态过渡到另一种状态的过程,今天学习到css3动画,特此记录下过渡的使用和一些效果. 实例1: <div clas ...

  9. 浅谈Task的用法

    Task是用来实现多线程的类,在以前当版本中已经有了Thread及ThreadPool,为什么还要提出Task类呢,这是因为直接操作Thread及ThreadPool,向线程中传递参数,获取线程的返回 ...

  10. Mysql学习笔记整理之索引

    索引的概念: 索引是一个分散存储的数据结构(检索)对数据库表中一列或多列的值进行排序 为什么要用索引? 索引能极大的减少存储引擎需要扫描的数据量 索引可以把随机IO变成顺序IO 索引可以帮助我们进行分 ...