Bonjour,

Je suis novice j'apprend la progamation et je souhaiterais réduire la taille de ma 1ére image qui est en top right dans mon background mais je ne sais pas comment procéder vu que j'ais 2 images.

Pourriez-vous m'aidez svp merci?

Voici le code:

body {

background: url("unix.png") fixed no-repeat top right, url("fond.png") fixed;

}

Bonjour, 

tu y es presque, il te manque juste pour chaque image le redimensionnement et le positionnement

quelques infos ici :

https://developer.mozilla.org/fr/docs/Web/CSS/background

Là on voit comment positionner et redimensionner une image en background, entraîne-toi sur la première image d'abord pour acquérir la syntaxe,
attention les images vont se superposer, avant d'avoir correctement positionner les deux

MoradMenguellati a écrit:

Bonjour je reviens vers vous cars je n'arrive à trouver la bonne syntaxe du coup je n'arrive pas à diminuer l'image.

Peux tu montrer ton code afin de voir ce que tu as tenté de faire? Car avec le lien que te donne Chris tu devrai être capable d'obtenir le résultat souhaité.

Voici un lien présent dans celui de Chris qui devrait t'aiguiller pour ton problème : https://developer.mozilla.org/fr/docs/Web/CSS/background-size

background: url("01.jpg")  abscisse ordonnée/largeur [hauteur] no-repeat

abscisse et ordonnée peuvent être une valeur en pixels, ou bien en pourcentage du parent, ou bien top, left, right ou bottom

largeur et hauteur en pixels ou pourcentage

une image qu'on positionne en haut et à 12px de la gauche, et qui fera 100px sur 200px :

background: url("01.jpg")  12px top / 100px 200px no-repeat

Sinon on peut aussi écrire :

div {
  background-image: url("logo-alsacreations-com.png"), url("soif.jpg");
  background-position: right bottom, 100px top;
  background-repeat: no-repeat;
}

plus simple en décomposant les propriétés !

Source : https://www.alsacreations.com/tuto/lire/814-css3-background-image-multiple.html

-
Edité par ChrisLebure 22 octobre 2021 à 14:29:03

Bonjour Lord morpheus,

Merci de te pencher sur mon problemeJ'ais rajouté la formule size 30px 50px aprés top right.

background: url("unix.png") fixed no-repeat top right size 30px 50px, url("fond.png") fixed;

}

merci pour ta réponse chris.

même en enlevant size et en laissant 30px 50px rien ne se passe.

Pareil pour ma bordure rien ne se passe :

P

{

border-radius: 5px;

}

Bonjour,

Il nous manque des infos pour t'aiguiller au mieux.

Voici donc un code fonctionnel que tu n'as plus qu'à reproduire. Je exprès dissocié chaque attribut pour te permettre de comprendre comment le double background fonctionne : https://jsfiddle.net/v2dapjwt/1/

Si après ça tu as encore des soucis, alors le problème viens d'ailleurs.

Bon courage!