CSS背景水平居中

Question

我有一个图像作为背景，具有以下CSS设置

#background {
  background-image: url('../img/bgimage.jpg');
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position: center;
  opacity: 0.8;
  filter:alpha(opacity=80);
  top:0;
}

我的目标是将背景居中（添加一点不透明度），但仍然在页面顶部开始。现在，当用户的监视器太大时，它看起来像这样

可以看到图像不是从顶部开始。 （灰色应该是以后的导航栏，但在这个问题上并不感兴趣）。蓝色是背景的一部分，白色显然只是一个通配符，直到背景开始保持中心可用。如何将图像水平居中，使其仍然从页面顶部开始，或者如何调整图像大小，以便适合用户的显示器尺寸？

Answer 1

您可以像解释here一样使用background-size: cover;。

Answer 2

简单一点，添加以下内容：

background-position: center center;
background-size: cover;

Perfect Full Page Background Image的更多信息。

Answer 3

要让背景始终覆盖其容器的表面，请使用

background-size: cover;