Discussion :

[Marc_]

Bonsoir,

je cherche à afficher une image en fond d'une page html, et bien évidemment elle s'affiche bien ou mal selon le navigateur utilisé (et sa configuration).
Je suppose que c'est un problème redondant mais il y a tellement de docs sur le dev web que c'est dur de trouver...

comment faire pour que mon image s'affiche toujours de la même manière?
je parle d'une image background qui est à l'origine en 1074*768 définie (pour le moment) dans ma css avec quelquechose comme:

Code CSS :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
BODY{
img-background:"test.jpg";
}

La syntaxe n'est peut-être pas exacte mais l'idée est là.

Je dipose d'un serveur qui gère le php donc peut-être de ce côté il y a une solution??

Merci d'avance de vos réponses et joyeuses fêtes!

[Bisûnûrs]

Déjà la syntaxe est :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
body{
   background-image:url(test.jpg);
}

Ensuite, je ne vois pas de différence d'interprétation entre les différents navigateurs avec cette syntaxe.

Essaie de rajouter d'autres paramètres :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
body{
   background:#000 url(test.jpg) no-repeat top left;
}

[Marc_]

En fait, le problème est que mon image est en 1024*768, et que si un utilisateur se connecte sur mon site en 1280*1024, l'image est trop petite pour prendre tout l'écran. Hors c'est une image de fond! Il faudrait qu'elle se mette en "fullscreen" quel que soit la résolution du navigateur.

Ainsi, comment faire pour que mon image s'ajuste automatiquement?

Evidemment elle sera moins jolie sur un écran de haute résolution mais ça ne me dérange pas trop.

Merci d'avance,

[blueice]

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
<img src="tonimage.jpg" height="100%" width="100%" alt="" />

Ensuite tu peux la mettre dans une div et écrire par dessus

[Marc_]

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<img src="tonimage.jpg" height="100%" width="100%" alt="" />

hmm comment faire pour mettre ces attributs à une image définie comme la mienne dans le BODY (c'est défini dans ma css, un truc du style:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
BODY{
background-image:url(test.jpg);
background-attachment:fixed;
}

désolé des questions stupides mais je débute en code web et il y a vraiment trop de docs useless.. impossible de trouver précisément ce que je cherche dans les tutos que j'ai trouvé ici ou sur google..

merci d'avance

[blueice]

On ne peut pas encore, certainement en CSS3 en faisant de la sorte :

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
html, body {
    background-image: url(ton_image.gif);
    background-size: 100%;
    background-origin: content;
}

Tu n'as pas lu ce que j'ai écrit !

tu peux la mettre dans une div et écrire par dessus

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
 
<div id="fond"><img src="tonimage.jpg" height="100%" width="100%" alt="" /></div>
<div id="head"></div>
<div id="contenu">
...
...
</div>