Discussion :

[Tartufion]

Bonjour,

Tout d'abord je tiens à m'excuser si ce sujet à déjà été abordé (je pense que c'est le cas) mais après plusieurs heures à chercher sur ce forum ou sur le net, je n'ai pas trouvé d'exemple pour faire ce que je recherche à faire.

Voilà, je fais en amateur bien sûr, un site pour un couple d'ami qui fait de l'hébergement. http://www.lachamade26.com
Il a sans doute pleins de petits défauts mais ce n'est pas le but de mon questionnement actuel.

Vu qu'il est relativement petit en taille, on voit le blanc de la fenêtre du navigateur autour de ce site, et j'aimerais pouvoir faire un dégradé ou mettre un léger fond autour. C'est là que je bute.

J'espère que vous saurez m'indiquer la direction à suivre car je ne sais comment m'y prendre.

Mon fond est géré uniquement dans mon CSS actuellement.

Code :

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

1
2
3
4
5
6
7
8
9
10
 
body {
	width:960px;
	height:744px;
	margin-left:auto;
	margin-right:auto;
	background-position:top;
	background-image: url(fondtest.jpg);
	background-repeat: no-repeat;
}

J'espère avoir formulé correctement ma demande.
Au plaisir de vous lire, bien amicalement
Tartufion

[NoSmoking]

Bonjour,
mets le contenu de ta page dans une DIV

Code :

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

1
2
3
4
5
6
7
8
9
#page{
  width:960px;
  height:744px;
  margin-left:auto;
  margin-right:auto;
  background-position:top;
  background-image: url(fondtest.jpg);
  background-repeat: no-repeat;
}

et déclares ton BODY

Code :

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

1
2
3
html, body{
  heght:100%;
}

maintenant tu peux placer ton fond particulier sur le BODY.

[miss_socrates]

En fait, ta représentation des choses n'est pas exacte: on ne met pas une image et une couleur autour (de la page), mais on place une couleur en fond qui occupe 100% de l'espace écran et par-dessus une image dont on précise la taille (par ex. 800x600 px).
De ce fait, l'image va se superposer à la couleur de fond qui sera invisible en dessous.
Mais si tu veux mettre une couleur dégradée, il faudra la réaliser avec un logiciel type Gimp ou Photoshop et la mettre comme image en fond.
Un exemple de code:

Code :

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

1
2
3
4
5
6
7
8
9
10
body {
	width: 100%;
	height:100%;
	margin: 0;
        padding: 0;
        background-color: white; /*couleur de fond de la page*/
	background-image: url(fondtest.jpg); /* l'image de couleur dégradée*/
	background-repeat: no-repeat;
        background-position: top center;
}

[Tartufion]

Bonjour,

Je vous remercie pour votre aide.
J'ai utilisé un "Div" comme me l'a indiqué NoSmoking, et cela fonctionne parfaitement.
Et je te remercie miss_socrates pour ton explication, c'est déjà bien plus claire dans mon esprit.

Encore un gros merci pour votre temps et votre aide.

Bien amicalement
Tartufion