Centrer une image de fond avec CSS

Question

Je veux centrer une image de fond. Il n'y a pas de div utilisé, c'est le style CSS :

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

Les tuiles CSS ci-dessus sont partout et sont centrées, mais la moitié de l'image n'est pas vue, elle est juste en train de monter. Ce que je veux faire, c'est centrer l'image. Puis-je adopter l'image pour voir même sur un écran 21 "?

Answer 1

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

Cela devrait fonctionner.

Sinon, pourquoi ne pas créer un div avec l'image et utiliser z-index pour en faire l'arrière-plan? Ce serait beaucoup plus facile à centrer qu'une image de fond sur le corps.

Autre que cela essayer:

background-position: 0 100px;/*use a pixel value that will center it*/ Ou je pense que vous pouvez utiliser 50% si vous avez défini votre corps min-height à 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%;
}
 

Answer 2

J'utilise ce code, ça marche 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;
}
 

Answer 3

Je pense que c'est ce qui est recherché:

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

Answer 4

Essayer

 background-position: center center;
 

Answer 5

Il y a une erreur dans votre code. Vous êtes à l'aide d'un mélange de plein de syntaxe et de la notation abrégée sur la propriété background-image.C'est la cause du no-repeat pour être ignoré, car il n'est pas une valeur valide pour la propriété background-image.

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

Devrait devenir l'une des opérations suivantes:

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

ou

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

EDIT: Pour votre image de "scaling" problème, vous voudrez peut-être regarder à cette question la réponse.