[Résolu] Background dégradé en CSS

[nympheur]

Bonjour à tous

Je cherche un moyen de mettre un fond en dégradé en css (d'ailleurs comment le faire?) mais j'avoue ne pas trop savoir comment m'y prendre....

J'ai bien vu que ça se tient dans le global css mais faut il changer tout le code du body? seulement une partie? d'autres partie du template à modifier?

Je sais que le sujet a été abordé mais je voulais comprendre la méthode

D'avance merci

[nympheur]

Pensez vous qu'avec ce code cela pourrait marcher?

 

body
{
background-image:url(http://www.monsite.com/image.jpg);
background-repeat:repeat-x;
background-position: top left;
background-color: #FF0000;
}

 

merci pour vos retours

[jeckyl]

Bonjour,

 

vous voulez intégrer une image d'un dégradé sur le fond de votre site ou créer un dégradé en CSS3 ?

[nympheur]

Bonsoir Jeckyl

j'aimerais créer un dégradé en CSS3. De plus doit on mettre une taille ou le fond s'adapte à la taille de l'écran? (j'ai mis pour exemple 500x200) et comment l'intégrer dans le global css? en lieu et place de celui qui s'y trouve?

<code class="css">
div {
 width: 500px; 
 height: 200px; 
 background: -moz-radial-gradient(#aedae5, #d8edf2);  
 position: relative;
}

 

Merci en tout cas d'avoir répondu

[jeckyl]

Bonjour,

 

il existe des générateurs de dégradés en CSS3 comme http://gradients.glrzad.com/

 

Le code fournis est à mettre dans la balise body en remplacement du fond déjà existant.

[BigCom]

Bonsoir Jeckyl

j'aimerais créer un dégradé en CSS3. De plus doit on mettre une taille ou le fond s'adapte à la taille de l'écran? (j'ai mis pour exemple 500x200) et comment l'intégrer dans le global css? en lieu et place de celui qui s'y trouve?

<code class="css">
div {
 width: 500px;
 height: 200px;
 background: -moz-radial-gradient(#aedae5, #d8edf2);  
 position: relative;
}

 

Merci en tout cas d'avoir répondu

 

 

S.V.P., ne pas utiliser des images enormes comme background. 500 * 200 c'est immense; cela utilise de la bande passante pour rien du tout (les clients ne vont jamais acheter cette image de fond, crois moi).

 

Une image defond va repeter avec :

 

background-repeat : none ou repeat-x ou repeat-y (si non precise, la dite image se repetera dans les deux axes)

 

Utilise un degrade CSS3, cela veut dire que IE6/7/8 (eventuellement 9) ne pouront pas etre servis (grosso modo 50 % de tes clients potentiels), + FF <=4 + vieux opera et safari + browsers exotiques (green browser par exemple qui est populaire en Asie). Donc ce sera joli, tu te feras plaisir, et tu n'auras que peu de visteurs (donc peu de clients).

[nympheur]

Bonjour,

 

il existe des générateurs de dégradés en CSS3 comme http://gradients.glrzad.com/

 

Le code fournis est à mettre dans la balise body en remplacement du fond déjà existant.

 

Grand merci Jeckyl c'est un petit outil que je vais bien garder

 

Merci BigCom pour ces infos que je ne soupçonnais pas

C'est quand même sympa d'avoir des conseils aussi avisés