css - 我如何将其居中

Question

我试图将这个 div 背景集中在www.bakoproduction.com。当我添加margin: auto到 css.div.background img时，它使图像居中，但不显示其余图像。这是我的css，如果有人可以帮助我，我将不胜感激。

<style type="text/css">
body {
    margin: auto;
    padding: 0;
    width: 100%;
    text-align: center;
}
.fondolineas {
    background-image: url(fondo.gif);
    background-repeat: repeat-x;
}
.demo-ad-top{
    margin:20px 0;
}
.gradient {
    background-image: -webkit-gradient(  linear,  left bottom,  left top,  color-stop(0.28, rgb(255,201,116)),  color-stop(0.64, rgb(228,143,10)) );
    background-image: -moz-linear-gradient(  center bottom,  rgb(255,201,116) 28%,  rgb(228,143,10) 64% );
    width:300px;
    height:150px;
    padding:5px;
}

h1 {
    font:bold 14px/1.5em "Trebuchet MS", Trebuchet, Arial, Verdana, Sans-serif;
    text-transform:uppercase;
}
div.background {
    position: absolute;
    left: auto;
    top: auto;
    z-index: -1;
    alignment-adjust: central;
    background-position: center;
    text-align: center;
}
div.background img {
    position:fixed;
    list-style: none;
    left:auto;
    top:auto;
}
div.background ul li.show {
    z-index:500
}
.content {
    width:1200px;
    margin-left:auto
    margin-right:auto
    background:#fff;
    padding:30px;
}
</style>

Answer 1

试试这个

background:no-repeat;
background-image:url(../Images/Home/Banner.png);
background-position:center;

并使用您的尺寸包含或拉伸背景，您必须使用它

background-size: contain;

Answer 2

您的图像不会响应将其边距设置为auto，因为您正在使用position: fixed;. 相反，通过将left和设置right为将其居中0。

div.background img {
    list-style: none;
    position: fixed;
      left: 0;
      right: 0;
      top: 0;
}

Answer 3

由于您将imgs 固定在屏幕上，因此margin:auto不会将它们居中。试试这个：

div.background img {
    position:fixed;
    left:50%;
    top:auto;
    margin-left:-600px; /* Half of the image's width */
}