web-dev-qa-db-fra.com

Rendre l'image d'arrière-plan sensible

Je veux rendre l'image d'arrière-plan sensible à la fois en largeur et en hauteur afin que je puisse l'exécuter sur mobile.

J'ai utilisé ceci 

.your_background_class_name {
    width: 100%;
    height:auto;
    top: 0px;
    left: 0px;
    z-index: -1;
    position: absolute;

}

mais cela ne fonctionne qu'en largeur mais pas en hauteur. Quels changements dois-je faire pour que cela fonctionne?

8
insanity
html { 
  background: url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcSvctt0I--skoKQVfuVt-i4Et6vQ5ve7lXPkLy9sTElCWLKh1Ps) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

En savoir plus sur background-sizeici.

Voir la démo

25
newTag

Le code suivant devrait faire l'affaire:

class_name {
    background: url(image);
    background-size: 100% auto contain;
}
0
Mykola Lys