iframe 怎么设置占全屏幕高度 100%

方法1 – Viewport-percentage lengths(视窗百分比长度)

支持的浏览器中,你可以用 viewport-percentage lengths,如:height: 100vh。
100vh 表示整个视窗的高度,100vw 表示整体视窗的宽度。

示例:

方法2 – Fixed positioning(固定定位)
这个方法比较直观,给元素设置 fixed 定位,并且设置 100% 的宽和高。
示例:

方法3
设置 body、html、iframe 三者的高度为 100%。
示例:

 

PS:推荐使用度方法 2,没有方法 1 那激进,也不像方法 3 需要设置 html, body 元素的高度。

 

参考链接:

  1. javascript – Full-screen iframe with a height of 100% – Stack Overflow

发表评论

电子邮件地址不会被公开。 必填项已用*标注