我正在构建一个Web应用程序,但不幸的是,页面顶部和左侧周围都有白色边框。我已经将html和body padding和margin设置为0px,但似乎对其没有任何影响。主体内部是单个iframe,当我预览站点并继续检查元素时,它表明填充物在主体上...
这是代码-如果有人可以看看,那就太好了!
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="chrome=1,IE=edge" />
<title>index</title>
<style>
html {
height:100%;
}
body {
background-color: #FFFFFF;
margin: 0px !important;
padding: 0px !important;
height:100%;
}
</style>
<!-- copy these lines to your document head: -->
<meta name="viewport" content="user-scalable=yes, width=320" />
<!-- end copy -->
</head>
<body>
<!-- copy these lines to your document: -->
<div id="index_hype_container" style="margin:auto;position:relative;width:100%;height:100%;overflow:hidden;" aria-live="polite">
<script type="text/javascript" charset="utf-8" src="index.hyperesources/index_hype_generated_script.js?4823"></script>
</div>
<!-- end copy -->
</body>
</html>
JSFiddle
最佳答案
尝试将#my-iframe
的边距设置为负数,例如-10px
:
#my-iframe {
width: 100vw;
height: 100vh;
border: 0;
padding: 0;
margin: -10px;
}
这可能会切断iframed站点的一小部分,但是从站点的外观来看,边缘边缘只有几个像素不会造成太大损害。
关于html - CSS-页面顶部和左侧的空白,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/32036062/