我正在与这个问题作斗争:
我有 iframe，我在其中显示网站，它有一些 html 结构。这个结构里面是元素，它有 css 属性: height: 100%; 问题是，该元素延伸到 iframe 的全高，无论如何我认为不应该。你能给我一些想法，如何解决这个问题？
这是 iframe 内容的源代码:
<html>
<head>
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
<link rel="stylesheet" href="https://raw.githubusercontent.com/daneden/animate.css/master/animate.css" />
<link rel="stylesheet" href="https://www.zeerat.com/assets/front/styles/swiper.css" />
<link rel="stylesheet" href="https://www.zeerat.com/assets/front/styles/style.css" />
<link rel="stylesheet" href="https://www.zeerat.com/assets/front/styles/grid.css" />
</head>
<body>
<div id="overview">
<div class="overview slider swiper-container swiper-container-horizontal">
<div class="swiper-wrapper">
XXX
</div>
</div>
</div>
<div id="benefits">
<div class="grid">
<article id="article1" class="clearfix">
<div class="text col right">
<h2>People behavior in one picture</h2>
</div>
</article>
</div>
</div>
</body>
</html>
这是源代码，我在其中放置了一个 iframe:
<!DOCTYPE html>
<html lang="cs" dir="ltr">
<head>
<meta charset="UTF-8">
<title>Titulek stránky</title>
</head>
<body>
<iframe src="iframe.html" width="1600" height="4000"></iframe>
</body>
</html>
非常感谢您的帮助。
最佳答案
子页面(iframe 内的页面)将从左上角开始显示，因此通常不需要定位子页面。父页面上 iframe 尺寸的样式决定了将看到多少子页面。最简单和最有效的方法是使 iframe 响应(能够适应屏幕尺寸和/或窗口的变化)
<!DOCTYPE html>
<html lang="cs" dir="ltr">
<head>
<meta charset="UTF-8">
<title>Titulek stránky</title>
</head>
<body>
<iframe src="iframe.html" width="100%" height="100%" style="position: absolute; top:0; left:0; right:0; bottom: 0; width: 100%; height: 100%;overflow: hidden; overflow-x: hidden; overflow-y: hidden;" allowfullscreen webkitallowfullscreen mozallowfullscreen ></iframe>
</body>
</html>
关于html - iframe 中高度为 : 100% strech 的元素，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32154459/