使用CSS将背景图像居中

Question

我想将背景图像居中.没有使用div,这是CSS样式:

body{
    background-position:center;
    background-image:url(../images/images2.jpg) no-repeat;
}

上面的CSS遍布并且确实居中,但是没有看到一半的图像,它只是向上移动.我想要做的是使图像居中.即使在21英寸的屏幕上,我可以采用图像查看吗？

Answer 1

background-image: url(path-to-file/img.jpg);
background-repeat:no-repeat;
background-position: center center;

这应该工作.

如果没有,为什么不用div图像制作并使用z-index它作为背景？这比身体上的背景图像更容易居中.

除此之外尝试:

background-position: 0 100px;/*use a pixel value that will center it*/或者我认为如果你将身体设置min-height为100%,你可以使用50 %.

body{

    background-repeat:no-repeat;
    background-position: center center;
    background-image:url(../images/images2.jpg);
    color:#FFF;
    font-family:Arial, Helvetica, sans-serif;
    min-height:100%;
}

Answer 2

我使用这个代码,它很好用

html, body {
  height: 100%;
  width: 100%;
  padding: 0;
  margin: 0;
  background: black url(back2.png) center center no-repeat;;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}

Answer 3

我认为这是想要的:

body
{
    background-image:url('smiley.gif');
    background-repeat:no-repeat;
    background-attachment:fixed;
    background-position:center;
} 

Answer 4

尝试

background-position: center center;

Answer 5

像这样：

background-image:url(https://upload.wikimedia.org/wikipedia/commons/thumb/8/8b/Dore_woodcut_Divine_Comedy_01.jpg/481px-Dore_woodcut_Divine_Comedy_01.jpg);
background-repeat:no-repeat;
background-position: center;
background-size: cover;

background-image:url(https://upload.wikimedia.org/wikipedia/commons/thumb/8/8b/Dore_woodcut_Divine_Comedy_01.jpg/481px-Dore_woodcut_Divine_Comedy_01.jpg);
background-repeat:no-repeat;
background-position: center;
background-size: cover;