Background-size

Taille de l'image originale : 400px x 200px

Taille du bloc original : 400px x 200px

sans

valeur par défaut
L'image garde sa taille originale et apparaît se répéter horizontalement et verticalement.

background-size: auto;

Valeur par défaut, donc même comportement que ci-dessus (sans).

L'image garde sa taille originale et apparaît se répéter horizontalement et verticalement.

background-size: 100% 100%

Quand les 2 valeurs sont identiques, on peut aussi avoir la formule compacte :
background-size: 100%;

La taille de l'image s'adapte sur la taille du bloc.
100% est calculé sur la taille du bloc, PAS sur celle d'image !

background-size: 50% 150%

Les pourcentages sont calculés sur la taille du bloc, PAS sur celle d'image !
L'image peut être déformée.

background-size: 400px 200px

Taille identique fixe de l'image.

background-size: 200px 300px

Taille quelconque fixe de l'image.
L'image peut être déformée.

background-size: contain

L'image s'adapte proportionnellement en prenant la largeur ou la hauteur maximale du bloc,
tout en gardant l'image en entier, ie non tronquée.
Limage "est contenue" (contain) dans le bloc.

background-size: cover

L'image s'adapte proportionnellement en prenant la largeur ou la hauteur maximale du bloc,
en remplissant au maximum de la surface du bloc. L'image peut alors être tronquée.
Limage "couvre" (cover) donc la totalité du bloc.

background-size: initial

Taille initiale de l'image, donc 100%.