Fond image qui s'adapte automatiquement

bonjour,

avec css c'est facile de faire un fonduni avec une image de faible hauteur qui se repete et forme le fond au final,mais comment utiliser cette technique ou une autre pour faire en sorte que cela forme une image de fond semi transparente ?? au lieu de coller betement une image complete qui va etre lourde et qui sera limitée en hauteur forcement ou va se repeter de maniere inesthetique...

merci

Bonjour et bienvenu

Ta question n'est pas très claire ...
Car cela dépend en grande partie de ce que tu entends par semi-transparent.

alors prenons une image avec un motif semi transparent afin d'ecrire clairement par dessus...est il possible dela construire avec un repeat Y ?? sinon peut on soit la positionner par dessus un fond uni ( a la maniere des claque photoshop) ou bien faire une image entire avec le motif et completer avec du uni avec repeat y ??

Euhm...
Je dois vachement être dans les cordes car je n'ai toujours rien compris ...
A priori, si ton fond peut se répéter dans le sens de la largeur ou dans celui de la longueur (comme par exemple un dégradé) le repeat-x ou repeat-y doit fonctionner je suppose

voici un exemple de fond semi transparent mais en un seul morceau :
leaf

Bonjour,

Je crois que j'ai compris !!
Alors si ta page à une hauteur fixe, tu peux donner à ton conteneur une image de taille fixe en dégradé si tu veux, par contre si ta hauteur est variable, il vaut mieux utiliser ton image en dégradé sans repeat positionnée comme tu le souhaites (background-position) sur un fond de couleur de la "fin" de ton dégradé comme cela quelque soit la hauteur de ta page ton fond s'adaptera .

C'est ça ?

oui c'est mon idée...mais je ne sais pas comment faire pour specifier cela dans mon css ...sachant qu ej'ai une classe pour le fond mais qui ici serai de 2 nature,fond fixe en haut de page et fond repeté en fin pour s'adapter...

Bonjour,

Il ne sera pas possible de spécifier 2 couleurs de fond, ni 2 images pour un même conteneur.

Que souhaites-tu faire exactement ?

Au passage, une petite remarque hors sujet : les frames sont déconseillées.
(Lire En finir avec les cadres)

Re,

Ben,

#ton_bloc{
background-image: url(ton_image.png ou gif);
background-repeat:no-repeat; /* valeur par défaut */
background-position: xxpx yypx; /* là c'est en px, position de ton image 0 0 par défaut je crois*/
background-color: # ta_couleur;
}

Voili voilou

merci ghost
en ce moment j'ai un souci pour faire courrir une image sur le header,le menu et le conteneur ppal eventuellement,mais c'est chaud à caler tout ca...
sinon je pense que mettre un div avec l'image puis du fond uni qui se repete est la bonne solution pour avoir un fond original qui s'adapte a la longueur..

Re,

Ce n'est pas si compliqué que ça, il suffit d'en comprendre la logique et de s'user les yeux à essayer encore et encore, c'est comme du mécano, tout le monde à les mêmes piéces mais le résultat n'est jamais le même ...

Bonne continuation

a écrit :
c'est comme du mécano

c'est peut etre ca le probleme justement...
mais bon en autodidacte c'est aussi la seule maniere...meme si je sais que je comprendrai bien plus vite si j'avais qqun sous la main pour m'expliquer...deja ya le forum c'est mieux que rien...

aiphes a écrit :
...deja ya le forum c'est mieux que rien...

Forum sur lequel on apprécie le soin donné à l'expression écrite ...


Un design peut-être "caler" de différentes façons, effectivement.
Il faut comprendre les possibilités mais aussi les limites de css.