Question

我想将轮播内容集中在页面上，并且还有一个固定的背景，并根据浏览器调整大小来改变高度/宽度。

请通过我的代码告诉我如何完成它。

Answer 1

对于居中，请删除left: 50%; css上的ul。

对于后台使用此css：

body
{
    background-image: url('replaceme');
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: 100% 100%;

}

并将replaceme替换为您想要的图像。

注意： 背景css有一些css3 artibute可能无法在旧的Internet Explorer中使用，如果您不想使用css3考虑使用此站点： {{3 }}

Answer 2

添加

text-align:center;

到身体并删除

left:50%;

来自ul的

将环形交叉口居中。

对于背景图像，您可以将div设置为100％宽度，位置绝对，顶部和底部0px，图像设置为100％宽度，以动态缩放，但是为了更好的CSS3方法，请查看csstricks.com ，那里有一个非常好的教程。

Answer 3

由于以上解决方案均未包含垂直和水平居中，因此将此添加到您的ul类中，如果这是您要实现的目标

ul {

 list-style: none;
 padding: 0;
 margin: -15em 0 0 -31em;
 width: 62em;
 height: 30em;
 background-color: #0C0C0C;
 top: 50%;
 left: 50%;

}

对于完全可调整大小的背景，我将使用FrontEndJohn解决方案，请记住为身体添加最小宽度和最小高度，以便您的图像不会延伸太多