Taille fond

Nos appareils photos nous permettent des photos dans différents rapports: le mien, par exemple:

4/3  souvent en 800x600px,

16/9  pour moi en 1000x563px

3/2  600x400px ?

1 photo carrée.

Ceci nous amène à modifier ces photos si nous les avons prises dans un format pour les publier dans un autre donc, à les déformer ou à n'en sélectionner qu'une partie.

En les publiant par l'icône "image", nous avons le choix du format et du rapport, qui va déformer notre image; nous pouvons également la publier en fond de cadre (background-image), ce que je fais régulièrement car il est ensuite plus facile d'intervenir sur le fond que sur une image indépendante.

Dans mon exemple, je vais considérer que mon image de départ est au format 16/9 (1000x563px)  et regarder comment la publier en 4/3 (800x600px), dans quelques choix de code:

background-size:auto;  l'image conserve sa largeur/hauteur,

background-size:cover; remplit la case sans déformer l'image, quitte à la rogner

background-size:contain; conserve les dimensions de l'image.

background-size: Wpx Hpx; valeurs largeur et hauteur imposées

Ceci ne résoudra pas l'adaptation de mes codes car ce serait plus simple de passer de 800x600px à 1000x563px; je ne vois pas d'autre solution que de reprendre le code avec les bonnes dimensions et la bonne photo.