html - HTML 元素未覆盖页面

Question

所以，我这里有一个奇怪的问题，我不确定它为什么存在。我正在处理一个网页，并通过以不重复的方式将其居中来添加背景图像，就像这样。这是来自外部 CSS

body {
    background-image: url('AllCalcBackground.png');
    background-position: center;
    overflow: hidden;
    margin: 0px;
}

溢出只是因为我不希望页面上有滚动条，而边距是这样的，如果我愿意，所有内容都可以与窗口的两侧齐平。无论如何，由于某种原因，图像决定不在页面中央，而是在顶部附近居中。我检查了页面(就像在浏览器中按 F12 来检查代码一样)，它说我的 HTML 和 body 元素实际上占据了网页的顶部 131px，我不知道为什么。除了 body 元素的这个 CSS 之外，没有任何东西会影响它们中的任何一个，它们只是让自己适合当前页面上的内容，而不是像我期望的那样填充页面。有谁知道为什么或可以帮我解决这个问题吗？

Answer 1

试试这个...

body { 
   margin: 0px;
   padding: 0px;
   background: url(AllCalcBackground.png) no-repeat center center fixed; 
   -webkit-background-size: cover;
   -moz-background-size: cover;
   -o-background-size: cover;
   background-size: cover;
}

此 CSS 将停止溢出并将您的图像作为静态图像适合背景，因此即使您滚动它也会保持在其位置。