如何防止空白出现在我的网页上方和下方

请点击此图片了解我的问题的详细描述

请参阅下面的HTML。我正在使用谷歌的Swiffy将我的ActionScript 3.0 SWF文件转换为HTML5。然后我使用iFrame将HTML5嵌入到我的网站中。

<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>Swiffy Output</title>
  <script type="text/javascript" src="https://www.gstatic.com/swiffy/v7.4/runtime.js"></script>
  <script>
    swiffyobject = {
        "as3": true,
        "frameRate": 24,
        "frameCount": 109,
        "backgroundColor": -1,
        "frameSize": {
          "ymin": 0,
          "xmin": 0,
          "ymax": 14500,
          "xmax": 20000
        },
        "fileSize": 233905,
        "v": "7.4.1",
  </script>
  <style>
    html,
    body {
      width: 100%;
      height: 100%
    }
  </style>
</head>
<body style="margin-top: 0px; margin-bottom: 0px; overflow: hidden">
  <div id="swiffycontainer" style="width: 100%; height: 100%; margin-top: 0px; margin-bottom: 0px;">
  </div>
  <script>
    var stage = new swiffy.Stage(document.getElementById('swiffycontainer'),
      swiffyobject, {});
    stage.start();
  </script>
</body>
</html>

           <iframe id="myiFrame" src="http://autogatesystems.businesscatalyst.com/phone/QS_Steel/QS_Steel.htm"
    style="border:0px;-webkit-overflow-scrolling: touch;overflow: hidden; fub;" name="myiFrame" scrolling="no" frameborder="0" marginheight="0" marginwidth="0" height="604" width="100%"></iframe>

您是否尝试将html和body元素的页边空白顶部和页边空白底部设置为0？

将div的高度设置为100%

height: 100%;

我解决了它！我把我的html谷歌Swiffy身体的高度改为：

    height: 60vw

在托管iFrame的HTML文件中，我将其更改为：

    height="60%"

顶部和底部的空白都消失了！

相关内容

最新更新

热门标签：