Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
765 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  Superposer deux fois deux images

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

Superposer deux fois deux images

n°2080328
nisalon_ca​je
Posté le 04-06-2011 à 07:18:36  profilanswer
 

Bonjour !

 

Je cherchais comment faire pour superposer deux images différentes en une seule, et j'ai trouvé la solution après une recherche google :

Code :
  1. <style type="text/css">
  2.     <!--
  3.     .multicouche {
  4.         position: relative;
  5.         display: block;
  6.     }
  7.     .multicouche img {
  8.         position: absolute;
  9.         display: block;
  10.     }
  11.     .couche1 {
  12.         z-index: 1;
  13.         top:5px;
  14.         left:5px;
  15.     }
  16.     .couche2 {
  17.         z-index: 2;
  18.     }
  19.     -->
  20. </style>
  21.     <span class="multicouche" >
  22.         <img class="couche1" src="img1.png" width="64"  />
  23.         <img class="couche2" src="img2.png" width="74" />
  24.     </span>
  25.     <span class="multicouche" >
  26.         <img class="couche1" src="img3.png" width="64"  />
  27.         <img class="couche2" src="img4.png" width="74" />
  28.     </span>
 

Le problème est que si je procède ainsi, je n'arrive pas à mettre côte à côte deux couples d'images :(
Si je fais ça :

Code :
  1. <style type="text/css">
  2.     <!--
  3.     .multicouche {
  4.         position: relative;
  5.         display: block;
  6.     }
  7.     .multicouche img {
  8.         position: absolute;
  9.         display: block;
  10.     }
  11.     .couche1 {
  12.         z-index: 1;
  13.         top:5px;
  14.         left:5px;
  15.     }
  16.     .couche2 {
  17.         z-index: 2;
  18.     }
  19.     -->
  20. </style>
  21.     <span class="multicouche" >
  22.         <img class="couche1" src="img1.png" width="64"  />
  23.         <img class="couche2" src="img2.png" width="74" />
  24.     </span>
  25.     <span class="multicouche" >
  26.         <img class="couche1" src="img3.png" width="64"  />
  27.         <img class="couche2" src="img4.png" width="74" />
  28.     </span>

, tout se superpose en une seule image.

 

J'aimerais en fait entre les deux couples d'images avoir le même comportement que si je mettais deux balises <img> l'une à la suite de l'autre (attention, je ne veux pas "truquer" en utilisant des calculs sur les positions pour correctement placer mon second couple, j'aimerais trouver une solution plus simple)

 

Merci d'avance

 

NC


Message édité par nisalon_caje le 04-06-2011 à 07:20:20

---------------
http://nisalon.labrute.com/
mood
Publicité
Posté le 04-06-2011 à 07:18:36  profilanswer
 


Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  Superposer deux fois deux images

 

Sujets relatifs
Dream cs5: remplacer images style diaporama(edit:résolu)Aide pour la création d'une fenêtre permettant de traiter des images
(résolu) Protection de données d'un repertoire, probleme de loadingProgramme pour isoler des images dans un fichier
Gestion dynamique d'images sous AndroidAjouter un symbole avec addChild mais le lire une seule fois
Téléchargement d'images pour formulaire de newsUpload plusieurs images
Afficher un message 1 fois par semaine et par visiteurProgamme en C pour fusionner deux images
Plus de sujets relatifs à : Superposer deux fois deux images


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR