28172 sujets

CSS et mise en forme, CSS3

Background en fonction de la fenetre

Bonjour à toutes et à tous,

J'ai fouiller sur le forum avant de poster mais le pb c'est que je ne comprends pas tout voir même pas grand chose (tuto sur le centrage horizontal et vertical notamment). Je souhaiterais savoir si il est possible d'afficher une image de fond en fonction de la taille de la fenêtre du navigateur.

Ce que j'ai:

un fichier index.html
un autre style.css
une image de 1666*1248

dans mon html:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
	<head>
       <title>test</title>
		<link href="style.css" rel="stylesheet" type="text/css"/> 
	</head>
	</body>
</html>


dans style.css:


body{
	background-image: url("background.png");
	}


J'ai essayé avec le tuto mais sans résultat. L'image n'est jamais centré et lorsque par exemple je reduis ma fenetre cela ne s'adapte jamais.

Merci de votre aide à tous.
Modifié par tester (27 Jun 2008 - 14:18)
Bonjour et bienvenue parmi nous Smiley smile

En tant que modérateur, je me dois de te faire remarquer que tu n'as malheureusement pas respecté l'une des Règles de base du forum qui est d'afficher les codes et exemples proprement à l'aide des boutons [ code]... ici ton code HTML, CSS, PHP, etc.[ /code] (sans espace).

Je te remercie par avance de bien vouloir éditer ton message afin de le rendre conforme à cette règle. Smiley cligne

D'ailleurs, je rappelle que le lien qui apparaît en bandeau tout en haut du forum ("Nouveau sur le forum ?...") est important. Il contient des pistes de recherche, des indications sur les règles de vie de la communauté, etc.
Il serait courtois de ta part de bien vouloir en prendre connaissance.

Bonne continuation Smiley smile

upload/1-code.gif
Modifié par Benjamin D.C. (27 Jun 2008 - 13:56)
tester a écrit :
Je souhaiterais savoir si il est possible d'afficher une image de fond en fonction de la taille de la fenêtre du navigateur.

Qu'est-ce que cela signifie exactement? Tu veux que ton image de fond recouvre l'entièreté de la fenêtre du navigateur dans tous les cas?
Oui Benjamin D.C. c'est exactement ce que je souhaite.

Ps: Désolé pour la mise en forme de mon post
Merci Smiley cligne Mais mais je ne parviens toujours pas à mettre ma page en pourcentage afin qu'elle s'affiche en plein écran. Car pour le moment elle s'affiche entièrement mais pour tout voir je dois me déplacer avec les ascenseurs.
tester a écrit :
Merci Smiley cligne Mais mais je ne parviens toujours pas à mettre ma page en pourcentage afin qu'elle s'affiche en plein écran. Car pour le moment elle s'affiche entièrement mais pour tout voir je dois me déplacer avec les ascenseurs.

Bah faut faire une mise en page fluide, alors.
Lire l'article: Faire un site pour toutes les résolutions.

Je signale tout de même que le coup de l'image de fond parfaitement adaptée à la résolution de l'utilisateur, c'est pas vraiment réalisable. Il y a des «trucs» (celui que présente Benjamin en est un... on peut aussi utiliser JavaScript ou les Media Queries pour appeler des images de fond différentes suivant la résolution), mais aucun n'est réellement satisfaisant. En général, on aura meilleur jeu à prévoir une image de fond unique qui aura un rendu décent avec les principales résolutions.
Ok Merci pour ton aide. Je pense que je vais faire un site avec une certaine dimension c'est à dire 1280*1024. Mais le soucis c'est que je ne m'y connait pas bcp et que l'on me demande de le faire quand même car pas de projet pour l'instant et que même faire un site avec une certaine taille je ne sais pas faire car mon image n'est JAMAIS apparue dans le navigateur comme il faudrait. Elle est toujours trop large ou trop haute.
Sujet clos
Aller à