[HTML] Mettre image en fond d'écran !! Fermé

Question

Bonjour, 

Donc voila j'ai réussi à trouver sur le net un code qui permet à l'image de s'adapter à la taille de la fenêtre :

<img style="position:absolute;left:0px;top:0px;width:100%;height:100%;"
   src="images/fond2.jpg" />

Je voudrais savoir comment rajouter l'option Background sans changer ce code car preuve du contraire je n'est pas réussi à reproduire la même chose en passant par le CSS !

Merci de votre aide!
Cordialement.


Configuration: Windows 7 / Firefox 3.6.10

faboons · Answer

Salut,

je ne comprends pas si ce code marche tu changes la destination de l'attribut src par l'image que tu veux.
Mais dans ce cas si l'image est trop petite elle va s'étirer jusqu'à remplir toute la fenêtre du navigateur.

La background ce serait pour quoi faire puisqu'il y a une image ?
Si c'est pour mettre une couleur, noire en l'occurence, derrière l'image :

<img style="position:absolute;left:0px;top:0px;width:100%;height:100%; background-color:black;"
   src="images/fond2.jpg" />

@ pluche.
Fab.

camille18 · Answer

L'image que je souhaite mettre en background et une image de fond ! c'est pour sa que je voulais que sa remplisse toute la fenêtre. Et je ne parviens pas à reproduire la même chose si je passe par le CSS. Le problème est que si le wallpaper n'est pas en transparence, que faire des autres images ?
A la base, l'image n'est pas trop petite mais plutôt trop grande.

faboons · Answer

Tu veux mettre une image de fond sous une balise image qui fait déjà la taille de l'écran ??????
Quelles sont les autres images ? Tu veux les mettre par dessus ?? Parce-qu'un background c'est derrière donc il n'a pas besoin d'être transparent.

Et je ne parviens pas à reproduire la même chose si je passe par le CSS.
C'est du css : style="position:absolute;left:0px;top:0px;width:100%;height:100%;" !!!

Je ne comprends pas vraiment ta question ni tes explications.

Un peu plus d'infos ?

camille18 · Answer

C'est bon je me suis débrouillé ! voici mon code pour ceux que sa intéresse :


body
{
background:url("images/wallpaper.png");
background-position: top right;
background-position:absolute;
width:100%;
height:100%;
margin: 0 auto;
}


Donc la l'image de fond va s'adapter avec la taille de la fenêtre !


Merci pour aide !
Cordialement.

duweb · Answer

ton code css contient des erreurs mais je te confirme que ca fonctionne quand même .
correction et explications :
- background-position:absolute; -> n'existe pas. 
- margin: 0 auto; -> tu centres ton élément alors que juste avant tu rempli toute la page

correction :
background:url("images/wallpaper.png") no-repeat top right;
/*position:absolute; inutile dans ce cas*/
/*width:100%; inutile dans ce cas*/
/*height:100%; inutile dans ce cas*/

evidemment il faudrait qu'on connaisse la taille de ton image, l'effet recherché (dégradé, photo, ... ?). le code change en fonction de ce qu'on veut faire

camille18 · Answer

Merci pour la correction :o
C'est un dégradé bleu.

[HTML] Mettre image en fond d'écran !!

6 réponses

Discussions similaires