28172 sujets

CSS et mise en forme, CSS3

Bonsoir à tous,

Question toute simple, est-il possible en CSS d'afficher deux images de background dans les balises body ? Vous allez me dire oui et m'orienter vers un article de ce site...

J'ai vu effectivement que c'était possible (et même facile) mais avec deux (et plus) images...

Par contre, si je veux une image (qui englobe toute la vue, donc toute la balise body) et une autre mais utilisé comme motif ? Donc la répéter à l'infinie sur toute la page...

Parce que après plusieurs essais et recherche sur le net je ne trouve rien.

Pouvez-vous m'aider ? Merci à vous et bonne fin de week-end.
Salut,
En effet c'est possible, voici la syntaxe:

#test{
	background: url("../images/test1.png") repeat 0 0,
	url("../images/test2.png") no-repeat right top, 
	url("../images/test3.png") no-repeat left bottom;
}
Merci pour ta réponse... Smiley smile

Effectivement cela fonctionne mais j'aurais une autre question. Avant, j'avais ceci :
    -webkit-background-size: cover;     /* pour Chrome et Safari */
    -moz-background-size: cover;        /* pour Firefox */
    -o-background-size: cover;          /* pour Opera */
    background-size: cover;             /* version standardisée */


En plus du background (ou background-image, je ne sais plus). A priori je n'en ai plus besoin mais je pose la question pour en être sûr... L'idée c'était de remplir le fond avec l'image et si l'utilisateur change la taille de la fenêtre de son navigateur, l'image suit le changement.

Par contre, l'image de fond est un dégradé. Actuellement c'est une image mais j'aimerais le changer en CSS. Comme l'ombrage du cadre de texte qu'il y'a au centre de la page. (actuellement le div qui contient l'ombre viens de disparaitre mais j'essaye de le ré-afficher correctement).

Pourrais-tu jeter un oeil sur cette page ? :
https://dl.dropbox.com/u/37161677/www/cgp/index.html

Bref, en gros remplacer l'image de fond par un dégradé par un CSS qui change en fonction de la taille de la fenêtre du navigateur. Idem j'ai essayé mais impossible d'obtenir un dégradé en mode radial. Bon je fais pas plus long et merci pour ton message.

PS : Très bonne idée d'image de profil, ça colle très bien au site Smiley smile
Modifié par MagicCarpet (20 Oct 2012 - 22:04)
UltrAs001 a écrit :
voici un lien qui va beaucoup t'aider:
http://www.colorzilla.com/gradient-editor/
Ca va te permettre de générer un dégradé en css compatible avec tous les navigateurs. (Et tu peux mettre orientation : radial).


Oui, j'ai essayé celui-ci (comme d'autres) mais quand je fais un copié-coller il passe en radial.
De plus il est plein centre, j'en aurais besoin tout en haut (le centre du dégradé doit ce trouver sur la moitié de la page en x et à 0 en y).

J'ai pourtant fais un copié coller du code généré, j'ai même essayé le plugin pour Photoshop... Je le construit en radial, je récupère le code généré, il s'affiche en linéaire...
Modifié par MagicCarpet (20 Oct 2012 - 22:28)