我试图使iframe拉伸到页面的整个宽度和高度，但当使用“宽度：100%”时，我得到了一个太大的iframe，如图所示。
这是代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head>
<style>
</style>
<body>
<h2>Text example to show that the width is too large and the content is out of it</h2>
<div class="container-fluid">
<iframe src="index.php" style="width:100%;height:1500px;overflow:hidden; border:none;"></iframe>
</div>
</body>
</html>
1条答案
按热度按时间yvgpqqbh1#
很可能是容器元素（body，main，content，whatever）都有左右填充。使用浏览器工具检查所有可能造成这种情况的元素。如果你找到了，试着删除填充。如果你因为某些原因不能删除，对iframe使用
width: 100vw，并对其应用negativemargin-left，该值与容器元素的左填充值相同（但为负值）。因此，例如，如果
body上有一个padding-left: 30px，则将margin-left: -30px（和width: 100vw）应用于该iframe。