背景图片不会显示在整个页面上

Question

嗨我的wordpress网站有问题 - 我用这个css来改变页面的背景：

.page-id-689 #primary {     background：url（'http://www.gamekey.sk/wp-content/uploads/2015/09/thief-totalne.jpg'）no-repeat center center！important;

-webkit-background-size：cover！important;

-moz-background-size：cover！important;

-o-background-size：cover！important;

background-size: cover !important;

min-height:100% !Important;

}

问题是背景不会显示在整个页面上（截图）。

我已经尝试过：

.page-id-287 #page_wrapper {height：100％！important;保证金：0px auto; }

html，body {height：100％}

我也尝试将min-height设置为100％ - 不会工作

!!!当我在#primary中将高度设置为1200px时，问题就解决了，但它也会在较低分辨率下造成巨大问题。有人可以帮我这个吗？

Answer 1

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Data.cs" Inherits="MyNamespace.Data" %> 涵盖了容器的大小。查看您的网站，＃primary id只会与其中的内容一样大。如果您希望它与图像具有相同的高度，则覆盖整个页面，您需要设置实际的高度值。尝试添加background-size: cover;，它会修复它，因为它是图像的高度。

如果您想要更优雅的解决方案，请将其添加到正文中：

height: 802px;

从body { background: url('http://www.gamekey.sk/wp-content/uploads/2015/09/thief-totalne.jpg') no-repeat center center fixed; } 移除background-color。

如果您希望多个页面具有不同的背景，则需要创建一个单独的包装器，该包装器具有唯一的ID，该ID运行页面的整个宽度和高度，无论其中的内容如何。

有关背景大小的更多信息，请访问：http://www.w3schools.com/cssref/css3_pr_background-size.asp

Answer 2

您应将所有容器元素的高度设置为100％，直至html元素http://prntscr.com/8o41id