Sujet Précédent Sujet Suivant

2 images en fond sur <body> sur une page web.

Fermé
NO-SOS Messages postés 381 Date d'inscription mercredi 4 août 2010 Statut Membre Dernière intervention 11 juin 2022 - Modifié par NO-SOS le 16/04/2011 à 00:05
NO-SOS Messages postés 381 Date d'inscription mercredi 4 août 2010 Statut Membre Dernière intervention 11 juin 2022 - 16 avril 2011 à 20:26
Salut à tous,
J'aimerais savoir comment mettre deux images en fond sur une page web.
L'idée c'est que j'ai "image1.jpg" et "image2.jpg".
"image1.jpg" va s'afficher en haut à gauche de la page, et "image2.jpg" va s'afficher en haut à droite.

j'ai ce code en css : 
body  
{  
     background-image : url("image1.jpg") ;  
     background-repeat : no-repeat ;  
     background-position : top left ;  
}

Mais si j'en fais deux dans le même fichiers, comme : 
body  
{  
     background-image : url("image1.jpg") ;  
     background-repeat : no-repeat ;  
     background-position : top left ;  

     background-image : url("image2.jpg") ;  
     background-repeat : no-repeat ;  
     background-position : top right ;  
}

L'une des deux images ne va pas s'afficher en fond. Hors, moi, ce que je veux, c'est qu'elle s'affiche toute les deux.

Si quelqu'un a la possibilité de m'aider le plus rapidement possible, je l'en remercie d'avance.
A bientôt.

(ps : si je ne suis pas très clair, dites le, merci encore.)





"Le but ce n'est pas de faire du cinéma, mais son cinéma."
-de Albert Dupontel-
A voir également:

2 réponses

Réponse 1 / 2
mpmp93
16 avril 2011 à 09:42
Bonjour,

C'est impossible en décrivant les deux images dans le css affecté à BODY.

La solution c'est de créer un autre élément FOOTER en HTML5 par exemple et de mettre une image de fond à FOOTER. 

<body>
  ....code HTML ....
  <footer>....tecxte du pied de page....</footer>
</body>


A+
0
Réponse 2 / 2
lermite222 Messages postés 8724 Date d'inscription dimanche 8 avril 2007 Statut Contributeur Dernière intervention 22 janvier 2020 1 191
16 avril 2011 à 09:44
Bonjour,
Le plus simple serait de fondre tes 2 images en une avec un programme de dessin.
ou bien avec du PHP
A+
0
NO-SOS Messages postés 381 Date d'inscription mercredi 4 août 2010 Statut Membre Dernière intervention 11 juin 2022 209
16 avril 2011 à 20:26
Oui, mais si je fond les deux images en une, ça rend pas forcément ce que je veux...
J'ai trouvé un système :
Je met "image.jpg" en fond, puis je crée 
<div id="background"></div>
en plein milieu des balises 
<body>
, ensuite je gère avec css: 

div#background
{
	position : fixed ;
	right : 0px ;
	top : 0px ;
}
div#background:after
{
	content : url("image2.jpg");
}


du coup avec mon navigateur ça va, ça rend bien, mais quand je réduis la taille de la fenêtre, "image 2.jpg" passe par dessus le reste du contenu web...

Et pour les deux images en 1, il faut que je la tire au plus loin, et ça ne correspond pas bien à la résolution....

Si vous avez toujours des idées...
0

Discussions similaires

Voxbone ? qui est-ce ?
fanfan54 -
djakool4 -

158 réponses
"Couleur de page" pour une seule page
lisa -
Lisa -

6 réponses