页脚覆盖/覆盖iframe的底部

时间:2015-02-07 02:00:50

标签: html iframe footer

编码新手 - 你能帮助我在iframe上放一个页脚吗?它需要覆盖当前在iframe中的深灰色页脚,如果页面放大或缩小,还需要响应。它现在可以是深灰色。

附件是当前的编码。

感谢您的帮助。

<!doctype html>
<html lang="en">
<head>
<title>TEST</title>
<meta charset="utf-8" />
<style>
body {
    display: flex;
    margin: 0;
    height: 100vh;
    }
iframe {
    min-height: 100%;
    min-width: 100%;
    }
</style>
</head>
<body>
<iframe scrolling="no" src="https://onedrive.live.com/embed?cid=71689B83CE6D0B52&resid=71689B83CE6D0B52%217352&authkey=AOXRS7b8IrWU4Qs&em=2"></iframe>
</body>
</html>

1 个答案:

答案 0 :(得分:0)

这是代码。

<!doctype html>
<html lang="en">
<head>
<title>TEST</title>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <style>
  body {
     margin: 0;
     padding: 0;
  }
  iframe {
     min-height: 100%;
     min-width: 100%;
     position: absolute;
     top: 0;
     bottom: 0;
     right: 0;
     left: 0;
  }
  .footer{
     position: absolute;
     width: 100%;
     bottom: 0;
     right: 0;
     left: 0;
     height: 50px;
     background: black;
   }
   </style>
</head>
<body>
  <iframe scrolling="no" src="https://onedrive.live.com/embed?cid=71689B83CE6D0B52&resid=71689B83CE6D0B52%217352&authkey=AOXRS7b8IrWU4Qs&em=2"></iframe>
  <div class="footer"></div>
</body>