Arriere plan dégradé?

Namu -  
 Rainbow -
Bjr,
Comment faire pour avoir un arriére plan en couleur dégardé?
Exemple: début en noir, puis reste ne bleu? au fur et a mesure?
Merci de votre aide

12 réponses

Rainbow
 
Il existe 3 types de navigateurs : Internet Explore, Firefox et le moteur Webit utilisé par Safari et Google-Chrome;

Comme les Navigateur n'utilise que les style qu'ils connaissent, il suffit de mettre les trois styles l'un sous l'autre.
Exemple pour un dégradé du rouge au vert.

/* Pour Internet Explorer */
filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=1, StartColorStr='#ff0000', EndColorStr='#0000ff');
/* Pour Firefox */
background:-moz-linear-gradient(left, #ff0000 0%, #0000ff 100%);
/* Pour Google-Chrome, Safari, Opéra (moteur Webkit) */
background:-webkit-gradient(linear, left top, right top, color-stop(0,#ff0000), color-stop(1, #0000ff));

Pour plus d'info, frapper "moz, webkit gradient" dans Google
13
soso59 Messages postés 33 Statut Membre 11
 
Voila un script qui pourrait t interesser

<!-- Dégradé Vertical -->
<BODY STYLE="filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#FFFFFF', EndColorStr='#000000')">

ou

<!-- Dégradé Horizontal -->
<BODY STYLE="filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=1, StartColorStr='#FFFFFF', EndColorStr='#000000')">

Ce n est pas exactement ce que tu recherches mais ca peut te donner une idee
http://acestgratuit.free.fr/scripts_dhtml/trans10.html
http://www.ccim.be/ccim328/trucs/trans10.html
http://www.javascriptfr.com

toujours faire confiance a google notre cher ami
6
soso59 Messages postés 33 Statut Membre 11
 
le mieux est que tu construises une image en dégradé avec les couleurs que tu veux et que tu l installes dans le background de ta page.

voici un exemple qui utilise une image fixe et centrée comme ca tu as toujours ton image entiére sur ta page.

background-image:url(images2/FOND.jpg);
background-position:50% 50%;
background-attachment:fixed;

tu peux également mettre une couleur dans le fond de la page si ton image ne remplit pas tout l ecran. sachant que la résolution d'écran la plus utilisée est 1024X768
background-color: #000000;

essai et tiens moi au courant
1
yurika5987
 
Et soso59 Tu t"appelerai pas Sovann par hasard, sinon je cherche un logiciel ou je pourrais faire des montages avec des photos perso comme arrière plan. Merci.
0
Gihef Messages postés 5165 Statut Contributeur 2 779
 
Bonjour,

En voici un exemple : fonddegrade.html

L'image fait 2x800px et pèse 1 200 octets.
Rien n'empêche d'en fabriquer une plus haute.
La couleur du bas de la page est la même que la dernière utilisée dans l'image.

On peut aussi commencer et terminer le dégradé par la même couleur, et on peut le laisser se répéter aussi en hauteur : fonddegrade2.html
1

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
P@ Messages postés 1710 Statut Membre 185
 
Sur toute ta page ???

Tu crées une image de 1px de large et autant de haut qu'il te convient.
sur l'image tu met ton dégradé et tu le met en fond. De mannière naturel, il va se dupliquer :D

Si il y a des techniques sans image, je ne les connais pas ... mais je serait trés intéréssé pour qu'on me les explique

0
namu
 
Merci de vos infos.
Donc cela est impossible en javascript ou html?
il faut que je fasse une petite image!
Merci de vos autres infos si qqn connait
0
soso59 Messages postés 33 Statut Membre 11
 
tu peux faire une image de 1024x768 comme je te l ai indiqué, il suffit d inscrire les codes dans ta page dans le head ou dans ta page css si tu l utilises.
0
P@ Messages postés 1710 Statut Membre 185
 
oui, mais dans ce cas :
1 tu fixes la hauteur et la largeur de la page
2 l'image est lourde a cgarger ... donc tu perd du temp au téléchargement.

Certaines personnes peuvent préférer un écran "flexible" qui s'adapte au poste utilisateur.
Ton image de 1024 sur 768 risque de tout casser sur un écran de plus grande résolution ...
et c'est en cela que la solution n'est pas génial.
Je n'en ai pas d'autre malheureusement, mais je comprend pourquoi la solution ne convient pas totalement.
Personnellement c'est pour cela que je n'utilise pas de dégradé ou seulement sur une petite partie. mais c'est tout :D

Si il y a d'autre solution ... sans utilisé d'image, je suis aussi prenneuse pour ma culture
0
Squalou Messages postés 29 Statut Membre 3
 
Bonjour,

En sachant quand même que cette méthode ne marche que sous IE :(

Je te conseille donc l'image de fond pour le moment...

@+
0
xbb Messages postés 49 Statut Membre 1
 
L'image de 1px de large qui se duplique horizontalement est une technique pas mal, mais a le défaut d'avoir une hauteur fixe... Aussi si la page est grande, le contenu débordera et dépassera l'image par en bas
0
Rem's
 
Bonjour,

C'est la raison pour laquelle il faut egalement mettre en couleur de fond la dernier pixels de l'image ainsi la page sera toujours sympa a voir, meme si qqn regarde la page en grande resolution ou bien que le texte depasse.

@+
0
rimadu06
 
oui pour organiser un projet il lui faut un arriere olan et tout et tout
0
bidossessy
 
Merci Gihef simple et efficace!
0