Centrar una imagen de fondo, usar CSS

Quiero centrar una imagen de fondo. No se usa div, este es el estilo CSS :

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

El CSS anterior muestra mosaicos y lo centra, pero la mitad de la imagen no se ve, simplemente se mueve hacia arriba. Lo que quiero hacer es centrar la imagen. ¿Podría adoptar la imagen para ver incluso en una pantalla de 21 “?

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

Eso debería funcionar.

Si no, ¿por qué no hacer un div con la imagen y usar z-index para que sea el fondo? Esto sería mucho más fácil de centrar que una imagen de fondo en el cuerpo.

Aparte de eso, intente:

background-position: 0 100px;/*use a pixel value that will center it*/ O creo que puedes usar el 50% si has establecido tu cuerpo como min-height al 100%.

 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%; } 

Yo uso este código, funciona bien

 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; } 

Creo que esto es lo que se quiere:

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

Tratar

 background-position: center center; 

Hay un error en tu código. Está utilizando una combinación de syntax completa y notación taquigráfica en la propiedad de la imagen de fondo. Esto hace que se ignore la no repetición, ya que no es un valor válido para la propiedad de la imagen de fondo.

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

Debería convertirse en uno de los siguientes:

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

o

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

EDITAR: para su problema de ‘escala’ de la imagen, es posible que desee ver la respuesta de esta pregunta .

Pruebe esta background-position: center top;

Esto hará el truco para ti.

 background-repeat:no-repeat; background-position:center center; 

No centra verticalmente la imagen de fondo cuando se utiliza un tipo de documento html 4.01 ‘STRICT’.

Agregar:

 background-attachment: fixed; 

Debería arreglar el problema

(Así que Alexander tiene razón)

si no está satisfecho con las respuestas anteriores, use esto

  * {margin: 0;padding: 0;} html { height: 100%; } body { background-image: url("background.png"); background-repeat: no-repeat; background-position: center center; background-size: 80%; } 

Tenía el mismo problema. Usó las propiedades de visualización y margen y funcionó.

 .background-image { background: url('yourimage.jpg') no-repeat; display: block; margin-left: auto; margin-right: auto; height: whateveryouwantpx; width: whateveryouwantpx; } 

simplemente reemplace

 background-image:url(../images/images2.jpg) no-repeat; 

con

 background:url(../images/images2.jpg) center; 

Me gusta esto:

 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; 
 html{ height:100% } body{ 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; } 

Lo único que funcionó para mí es …

 margin: 0 auto